我們知道，在一個網頁中，由文本、樣式及交互三部分組成，而JavaScript主要負責網頁中的交互。那么如何在HTML頁面中插入JavaScript呢？因為HTML5已經快速地被前端開發人員采用，所以為了遵循HTML5標準，這篇文章主要來介紹JavaScript如何在HTML中的使用，不會涉及到在XHTML中的用法。
一、<script>元素
向HTML頁面中插入JavaScript，就是使用<script>元素。它有以下幾個主要常用的屬性：
- type:表示編寫代碼使用的腳本語言的內容類型，可以省略,表現形式是
type = "text/javascript"。
- defer:使用它相當于告訴瀏覽器立即下載，但是延遲執行，也就是說腳本延遲到整個文檔完全被解析和顯示完畢之后再執行，可以省略，表現形式是
defer = "defer"。它只適用于外部腳本文件，在HTML5中已經明確規定，因此支持HTML5的實現會忽略給嵌入腳本設置的defer屬性。而且還有瀏覽器兼容等問題，所以把延遲腳本放在頁面底部仍然是最佳選擇。
- async:立即異步下載外部js，js下載完畢后立即執行，不影響頁面其他的操作，可以省略，表現形式是
async = "async"。只有外部腳本文件可以使用,而且標記為async的腳本并不能保證按照指定它們的先后順序執行，因此要確保兩者之間不依賴。指定async屬性的目的是不讓頁面等待兩個腳本下載和執行，從而異步加載頁面其他內容，為此，建議異步腳本不要在加載之間修改DOM。
- src:表示包含要執行代碼的外部文件，可以省略，表現形式
src = "main.js"。
二、引入JavaScript
在HTML中引入JavaScript有以下2兩種方式：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>alert</title>
<script type="text/javascript">
alert("hello world！"); // 彈出消息框
</script>
</head>
<body>
</body>
</html>
- 引入外部JavaScript文件
<script src = "main.js"></script>
三、<script>元素的位置
按照傳統的做法，所有<script>元素都應該放在頁面的<head>元素中，這種做法的目的是想要把CSS、JavaScript等所有外部文件的引用都放在相同的地方，但是這樣做有很大的弊端，必須等到所有的JavaScript代碼都被下載、解析和執行完畢以后，才能開始呈現頁面的內容，因為瀏覽器在遇到<body>標簽時才開始呈現頁面內容。如果頁面有很多JavaScript代碼的話，就會導致瀏覽器在呈現頁面時出現明顯的延時，所以為了避免這個問題，現代的web應用程序一般都會把JavaScript代碼頁面后面，即主要內容后面，</body>標簽前面。
四、書寫規范
- JavaScript和HTML、CSS一樣，對空格、換行、縮進不敏感。
- 書寫代碼，語句結束時，分號和空格必須有一個，否則會報錯,盡量分號和空格一起使用，提高可讀性。
