資料結構
網路
關係型資料庫管理系統
作業系統
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP
物理學
化學
生物學
數學
英語
經濟學
心理學
社會學
服裝設計
法律研究我應該在 HTML 的 body 部分還是 head 部分編寫我的指令碼？
在 HTML 中，指令碼標籤可以插入到 head 部分或 body 部分，通常 JavaScript 程式碼插入在 script 的開始和結束標籤之間。
<script> //JavaScript code here </script>
我們可以在 HTML 文件中插入任意數量的指令碼。指令碼可以放在 <body> 或 <head> 部分，或者同時放在兩個部分中。現在，讓我們看看如果我們在 HTML 的 body 或 head 中插入指令碼是否有任何區別。
最好將 JavaScript 程式碼放在 <body> 標籤的閉合標籤之前，而不是放在 HTML 的 <head> 部分。
HTML 總是遵循自上而下的方法來執行程式，如果我們在 head 部分編寫 JavaScript，首先載入 JavaScript，然後是 HTML 程式碼，這會導致一些問題，例如：
如果 JavaScript 導致任何錯誤，接下來它將不會讀取我們的 HTML 內容，它會顯示錯誤。
如果 JavaScript 程式碼過多，那麼我們訪問的頁面顯示 HTML 內容的速度會變慢，因為所有 JavaScript 程式碼都載入完畢後才會載入 HTML，這會減慢伺服器速度。
為了克服這些缺點，最好在 body 標籤的閉合括號之前編寫 JavaScript 程式碼。
示例
下面的示例嘗試將段落的文字顏色更改為紅色，但顏色沒有改變，因為指令碼載入在段落標籤之前。
因此，在指令碼執行時段落元素不可用，所以顏色不會改變。
<html>
<head>
<script>
document.querySelector('#sample').style.color="red"
</script>
</head>
<body>
<p id="sample">
Changes the text of TutoriaslPoint to Red Color!
</p>
</body>
</html>
當我們執行上面的程式時，我們看到文字，並且顏色沒有改變。
示例
在下面的示例中，讓我們嘗試透過在 HTML 程式碼的 body 標籤閉合標籤之前新增 JavaScript 來更改程式碼。
<html>
<body>
<p id="sample">
Changes the text of TutoriaslPoint to Red Color!
</p>
<script>
document.querySelector('#sample').style.color="red"
</script>
</body>
</html>
當我們執行上面的程式時，文字顏色變為紅色，但是將 JavaScript 放在 HTML 的 <head> 中並不總是會導致錯誤。
因此，在很多情況下，與 body 相比，在 head 部分編寫指令碼更好。根據程式碼的使用情況和長度，使用者可以選擇編寫程式碼的位置。
示例
考慮另一個示例，以瞭解更多關於在 head 或 body 部分放置 JavaScript 的資訊。
下面的示例演示了相反的情況，如果我們在 head 部分插入 JavaScript，顏色會顯示，而在 body 部分則不會顯示。
<!DOCTYPE html>
<html>
<head>
<script>
function main() {
document.getElementById("sample").innerHTML = "Learning Script Tag";
}
</script>
</head>
<body>
<h2>Insert Script in Head Section</h2>
<p id="sample" style="color:blue;">TutorialsPoint</p>
<button type="button" onclick="main()">click it</button>
</body>
</html>
當您執行上述程式時，將顯示一個表單，標題為“在 head 部分插入指令碼”，並有一個 Id 屬性“TutorialsPoint”，以及一個標記為“點選”的提交按鈕。
點選“點選”按鈕後，將顯示以下頁面
示例
讓我們嘗試透過在 HTML 程式碼的 body 標籤閉合標籤之前新增 JavaScript 來更改程式碼。
<!DOCTYPE html>
<html>
<center>
<body>
<h2>Insert Script in Body Section</h2>
<p id="sample">TutoriaslPoint</p>
<button type="button" onclick="sample()">Click It</button>
<script>
function sample() {
document.getElementById("sample").innerHTML = "Learning Script Tag";
}
</script>
</body>
</center>
</html>
當我們執行上面的程式時，我們看到對齊方式發生了變化，Id 屬性、按鈕和標題都居中對齊。此外，文字顏色沒有改變，因為程式碼沒有影響段落的顏色。
點選“點選”按鈕後，將顯示以下頁面
653 次瀏覽
