Java專案中載入properties檔案的方式

阿新 • • 發佈：2021-12-05

JavaScript

JavaScript（簡稱“JS”）是一種具有函式優先的輕量級，解釋型或即時編譯型的程式語言。作為開發Web頁面的指令碼語言而出名，也被用到了很多非瀏覽器環境中，JavaScript 基於原型程式設計、多正規化的動態指令碼語言，並且支援面向物件、命令式、宣告式、函數語言程式設計正規化

功能

嵌入動態文字於HTML頁面

對瀏覽器檔案做出響應

讀寫HTML元素

在資料被提交伺服器前驗證資料

檢測訪客的瀏覽器資訊，控制cookies

基於Node.js技術進行伺服器程式設計
執行模式

廣泛用於Web應用開發,常用來為網頁新增各式各樣的動態功能，

通常JavaScript指令碼是通過嵌入在HTML中來實現自身的功能的
特點

指令碼語言

基於物件

簡單

動態性

跨平臺性

第一個JavaScript

首先建立一個html頁面

其次在head或者head部分插入JavaScript程式碼

（在HTML body部分中的JavaScript會在頁面載入的時候被執行。在HTML head部分中的JavaScript會在被呼叫的時候才執行）

或者單獨編寫JavaScript，在匯入

<script src="myScript.js"></script>

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">  
  <title>baidu.com</title>  
  <script>    
    document.write("Hello World");    
    document.writeln("3Year1Class");    
    document.write("death death"); 
    //write與writeln的區別，後者輸出字串後還會輸出換行符，頁面顯示為空格
    //真正要想在顯示的時候換行，請使用<br>或<br/>。
    //<pre>和<code>內的元素在顯示的時候會保留原始碼中的空格或換行符。
  </script>
  </head>
  <body>
    <script>  
      document.write("<h1>一級標題</h1>");  
      document.write("<p>換行</p>");  
      document.write("<strong>加粗</strong>");
    </script>
  </body>
</html>

JavaScript方法

HTML DOM alert()方法

（ DOM (DocumentObjectModel)（文件物件模型））

alert() 方法用於顯示帶有一條指定訊息和一個 OK 按鈕的警告框。

<button type="button" onclick="alert('hello world')"></button>
<!-- alert()方法>

修改HTML的內容

使用該方法來“查詢” id="demo" 的 HTML 元素，並把元素內容（innerHTML）更改為 "Hello JavaScript"：

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">  
  <title>baidu.com</title>  
  <script> 
    function myFunction()
     {      
      x = document.getElementById("demo");      
      x.innerHTML = "good bye!!!";    
     }  
  </script>
  </head>
  <body>
    <p id="demo">Hello My Dear</p>
    <button type="button" onclick="myFunction()"></button>
  </body>
</html>

修改HTML的圖片

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>picture</title>
 <script>
  function imageChange()
   {
    element=document.getElementById(`myImage`);
    if(element.src.match("button"))
     {
      element.src = "../picture/1.png";
     }else
     {
      element.src = "../picture/2_button.png";
     }
   }
 </script>
</head>
<body>
<img loading="lazy" id = "myImage" onclick="imageChange()" src="../picture/1.png" height="180" width="100">
<p>點選改變圖片</p>

</body>
</html>

修改HTML樣式

onclick="document.getElementById('demo').style.fontSize='35px'"

隱藏HTML元素

document.getElementById("demo").style.display="none";

顯示HTML元素

document.getElementById("demo").style.display="block";

注意

HTML 輸出流中使用 document.write，相當於新增在原有html程式碼中新增一串html程式碼。而如果在文件載入後使用（如使用函式），會覆蓋整個文件。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script>
        function myfunction(){
            document.write("使用函式來執行doucment.write，即在文件載入後再執行這個操作，會實現文件覆蓋");
        }
        document.write("<h1>這是一個標題</h1>");
        document.write("<p>這是一個段落。</p>");
    </script>
    <script src="js/demo.js"></script>
</head>
<body>
<p >
    您只能在 HTML 輸出流中使用 <strong>document.write</strong>。
    如果您在文件已載入後使用它（比如在函式中），會覆蓋整個文件。
</p>
<button type="button" onclick="myfunction()">點選這裡</button>
</body>
</html>

JavaScript的輸出

JavaScript 沒有任何列印或者輸出的函式

顯示資料

使用 window.alert() 彈出警告框。
使用 document.write() 方法將內容寫到 HTML 文件中。
使用 innerHTML 寫入到 HTML 元素。
使用 console.log() 寫入到瀏覽器的控制檯。

window.alert("Hello World");
document.write("這是一場試煉");
console.log("準備好了嗎");
function myfunction()
{
    element = document.getElementById("test");
    element.innerHTML = "bye bye";
}
// 主要是方便你調式javascript用的, 你可以看到你在頁面中輸出的內容。
//相比alert他的優點是：
//他能看到結構化的東西，如果是alert，彈出一個物件就是[object object],但是console能看到物件的內容。
//console不會打斷你頁面的操作，如果用alert彈出來內容，那麼頁面就死了，但是console輸出內容後你頁面還可以正常操作。
//console裡面的內容非常豐富，你可以在控制檯輸入 console，然後就可看到：

console.log指令碼

(function() {
    var _log = console.log;
    console.log = function() {
        if (typeof(arguments[0]) != 'object' && typeof(arguments[0]) != 'function' && arguments.length == 1) {
            _log.call(console, '%c' + arguments[0], "text-shadow: 0 1px 0 #ccc,0 2px 0 #c9c9c9,0 3px 0 #bbb,0 4px 0 #b9b9b9,0 5px 0 #aaa,0 6px 1px rgba(0,0,0,.1),0 0 5px rgba(0,0,0,.1),0 1px 3px rgba(0,0,0,.3),0 3px 5px rgba(0,0,0,.2),0 5px 10px rgba(0,0,0,.25),0 10px 10px rgba(0,0,0,.2),0 20px 20px rgba(0,0,0,.15);font-size:5em")
        } else {
            _log.call(console, ...arguments)
        }
    }
})()
//改變console.log輸出的文字樣式

語法

JavaScript 語句定義兩種型別的值：混合值和變數值。

混合值被稱為字面量（literal）。變數值被稱為變數。

固定值為字面量

var 定義變數

註釋

變數

變數是用於儲存資訊的"容器"

'use strict';
var num = 1;
var num1 = "string";
var num2 = 3,num4 = 4,num5 = 5;
var num = true;
var student = {
    name : "張三",
    age  : 18,
    shout : function ()
    {
        return "你好";
    }
}

=== 為絕對相等，即資料型別與值都必須相等。