全能編程開發工程師筆記 – 關於標籤

一、script標籤

標籤用於定義客戶端腳本，比如JavaScript。你可以在script元素中編寫腳本，也可以引用外部腳本文件。script標籤常常放置在HTML文檔的head元素中。

<!DOCTYPE html>
<html>
<head>
<script>
function myFunction() {
  document.getElementById("demo").innerHTML = "Hello World!";
}
</script>
</head>
<body>

<h2>JavaScript in Head</h2>

<p id="demo">A Paragraph.</p>

<button type="button" onclick="myFunction()">Try it</button>

</body>
</html>

二、scripture

scripture是指《聖經》，與標籤本身沒有太大關係。

三、script error

當客戶端JavaScript存在語法錯誤或其他運行時錯誤時，會發生script error。你可以在瀏覽器控制台中查看這些錯誤信息。

四、scripts

scripts是指客戶端腳本文件，可以是JavaScript、VBScript等腳本。在HTML文檔中，我們可以通過script標籤引入這些腳本文件。以下代碼展示如何引入scripts中的一個JavaScript文件：

<!DOCTYPE html>
<html>
<head>
<script src="myscripts.js"></script>
</head>
<body>

<h2>My First Web Page</h2>

<p>My first paragraph.</p>

</body>
</html>

五、script標籤的作用

script標籤可以用於以下幾個方面：

定義JavaScript腳本
引入JavaScript文件
定義文檔類型
定義外部資源類型

六、script標籤放在什麼位置

一般情況下，script標籤放在head元素中，以確保在頁面加載時腳本被加載和解釋。但如果您的腳本依賴於頁面元素，則應該將其放在元素後面。例如：

<!DOCTYPE html>
<html>
<head>
<script src="myscripts.js"></script>
</head>
<body>

<h2>My First Web Page</h2>

<p>My first paragraph.</p>

<script>
document.getElementById("demo").innerHTML = "Hello JavaScript!";
</script>

</body>
</html>

七、script async和defer

async和defer都是為了優化頁面性能而生。它們都可以異步加載腳本，但實現方式略有不同。

使用async，腳本將立即異步加載，而不會阻止文檔解析。可以多次使用async屬性，但是如果多個腳本依賴於彼此，則有可能出現問題。

使用defer，腳本也可以異步加載，但會在文檔解析完成之後才執行。可以多次使用defer屬性，但腳本的執行順序會按照它們的位置來決定。

<!DOCTYPE html>
<html>
<head>
<script src="scripts.js" async></script>
</head>
<body>

<h2>My First Web Page</h2>

<p>My first paragraph.</p>

</body>
</html>

原創文章，作者：小藍，如若轉載，請註明出處：https://www.506064.com/zh-hant/n/236663.html