<script> 標簽 在 HTML 中,JavaScript 代碼必須位於 <script> 與 </script> 標簽之間。 實例 註釋:舊的 JavaScript 例子也許會使用 type 屬性:<script type="text/javascript">。 註釋:type 屬性不是必需的 ...
<script> 標簽
在 HTML 中,JavaScript 代碼必須位於 <script> 與 </script> 標簽之間。
實例
<script> document.getElementById("demo").innerHTML = "我的第一段 JavaScript"; </script>
註釋:舊的 JavaScript 例子也許會使用 type 屬性:<script type="text/javascript">。
註釋:type 屬性不是必需的。JavaScript 是 HTML 中的預設腳本語言。
JavaScript 函數和事件
JavaScript 函數是一種 JavaScript 代碼塊,它可以在調用時被執行。
例如,當發生事件時調用函數,比如當用戶點擊按鈕時。
提示:您將在稍後的章節學到更多有關函數和事件的知識。
<head> 或 <body> 中的 JavaScript
您能夠在 HTML 文檔中放置任意數量的腳本。
腳本可被放置與 HTML 頁面的 <body> 或 <head> 部分中,或兼而有之。
<head> 中的 JavaScript
在本例中,JavaScript 函數被放置於 HTML 頁面的 <head> 部分。
該函數會在按鈕被點擊時調用:
<!DOCTYPE html> <html> <head> <script> function myFunction() { document.getElementById("demo").innerHTML = "段落被更改。"; } </script> </head> <body> <h1>一張網頁</h1> <p id="demo">一個段落</p> <button type="button" onclick="myFunction()">試一試</button> </body> </html>
<body> 中的 JavaScript
在本例中,JavaScript 函數被放置於 HTML 頁面的 <body> 部分。
該函數會在按鈕被點擊時調用:
<!DOCTYPE html> <html> <body> <h1>A Web Page</h1> <p id="demo">一個段落</p> <button type="button" onclick="myFunction()">試一試</button> <script> function myFunction() { document.getElementById("demo").innerHTML = "段落被更改。"; } </script> </body> </html>
外部腳本
腳本可放置與外部文件中:
外部文件:myScript.js
function myFunction() { document.getElementById("demo").innerHTML = "段落被更改。"; }
外部腳本很實用,如果相同的腳本被用於許多不同的網頁。
JavaScript 文件的文件擴展名是 .js。
如需使用外部腳本,請在 <script> 標簽的 src (source) 屬性中設置腳本的名稱:
<script src="myScript.js"></script>
外部 JavaScript 的優勢
在外部文件中放置腳本有如下優勢:
- 分離了 HTML 和代碼
- 使 HTML 和 JavaScript 更易於閱讀和維護
- 已緩存的 JavaScript 文件可加速頁面載入
如需向一張頁面添加多個腳本文件 - 請使用多個 script 標簽:
<script src="myScript1.js"></script> <script src="myScript2.js"></script>
外部引用
可通過完整的 URL 或相對於當前網頁的路徑引用外部腳本:
本例使用完整的 URL 來鏈接至腳本:
實例
<script src="https://www.w3school.com.cn/js/myScript1.js"></script>