在 HTML 中使用 JavaScript

在html中使用JavaScript腳本有兩種方式一種是嵌入在HTML中的腳本，另一種是引入外部的腳本。兩種方式都離不開<script>元素。

1. <script>元素介紹
<script>有下面6個元素
1.async；html頁面的渲染是阻塞型的，即從上而下遇到JavaScript腳本會進(jìn)行解析和執(zhí)行，腳本全部解析執(zhí)行完成再接著往下渲染其他內(nèi)容，有了async屬性，就可以解析并執(zhí)行js腳本的同時渲染其他內(nèi)容。二者并行執(zhí)行，不會造成阻塞。
2.charset；字符編碼，較少使用。
3.defer；與async類似，區(qū)別在于，有defer屬性的js腳本的執(zhí)行會在文檔完全渲染之后。即async是js腳本解析執(zhí)行與文檔渲染是并行的。defer是解析于文檔渲染并行，執(zhí)行在文檔渲染之后。二者都只對外部javascipt腳本有效。
4.language(已廢棄)；
5.type；常見的有type='text/javascript' 目的表示腳本的內(nèi)容類型，不寫默認(rèn)為text/javascript ，JavaScript太火，默認(rèn)腳本類型已成為JavaScript。
6.src：用來引入外部javascript腳本。需要注意的是，帶有 src 屬性的<script>元素不應(yīng)該在其<script>和</script>標(biāo)簽之間再 包含額外的 JavaScript代碼。如果包含了嵌入的代碼，則只會下載并執(zhí)行外部腳本文件，嵌入的代碼 會被忽略。
在使用<script>嵌入 JavaScript代碼時，記住不要在代碼中的任何地方出現(xiàn)"</script>"字符串。 例如，瀏覽器在加載下面所示的代碼時就會產(chǎn)生一個錯誤：

<script type="text/javascript"> function sayScript(){ alert("</script>"); } </script>

因?yàn)榘凑战馕銮度胧酱a的規(guī)則，當(dāng)瀏覽器遇到字符串"</script>"時，就會認(rèn)為那是結(jié)束的 </script>標(biāo)簽。而通過轉(zhuǎn)義字符“”可以解決這個問題，例如：<script type="text/javascript">

function sayScript(){ alert("<\/script>"); } </script>

這樣寫代碼瀏覽器可以接受，因而也就不會導(dǎo)致錯誤了。

2. javascript放置的位置
將JavaScript腳本放在</body>標(biāo)簽前是最佳的。原因JavaScript的加載總是阻塞內(nèi)容的渲染，如果放在頭部等位置會由于javascript腳本的阻塞頁面遲遲渲染不出來，導(dǎo)致用戶體驗(yàn)差，其次當(dāng)js對dom節(jié)點(diǎn)進(jìn)行操作時，會因?yàn)楣?jié)點(diǎn)沒有渲染而導(dǎo)致操作失敗。

3. <noscript>
用以在不支持 JavaScript 的瀏覽器中顯示替代 的內(nèi)容。在<noscript>元素中的內(nèi)容只有在下列情況下才會顯示出來： （1） 瀏覽器不支持腳本； （2）瀏覽器支持腳本，但腳本被禁用。

4. 小結(jié)
把 JavaScript 插入到 HTML 頁面中要使用<script>元素。使用這個元素可以把 JavaScript 嵌入到 HTML頁面中，讓腳本與標(biāo)記混合在一起；也可以包含外部的 JavaScript文件。而我們需要注意的地方有：
1.在包含外部 JavaScript文件時，必須將 src 屬性設(shè)置為指向相應(yīng)文件的 URL。而這個文件既可 以是與包含它的頁面位于同一個服務(wù)器上的文件，也可以是其他任何域中的文件。
2.所有<script>元素都會按照它們在頁面中出現(xiàn)的先后順序依次被解析。在不使用 defer 和 async 屬性的情況下，只有在解析完前面<script>元素中的代碼之后，才會開始解析后面 <script>元素中的代碼。
3.由于瀏覽器會先解析完不使用 defer 屬性的<script>元素中的代碼，然后再解析后面的內(nèi)容， 所以一般應(yīng)該把<script>元素放在頁面后，即主要內(nèi)容后面，</body>標(biāo)簽前面。
4.使用defer 屬性可以讓腳本在文檔完全呈現(xiàn)之后再執(zhí)行。延遲腳本總是按照指定它們的順序執(zhí)行。
5.使用 async 屬性可以表示當(dāng)前腳本不必等待其他腳本，也不必阻塞文檔呈現(xiàn)。不能保證異步腳 本按照它們在頁面中出現(xiàn)的順序執(zhí)行。
6.另外，使用<noscript>元素可以指定在不支持腳本的瀏覽器中顯示的替代內(nèi)容。但在啟用了腳本 的情況下，瀏覽器不會顯示<noscript>元素中的任何內(nèi)容。

--------------------由于水平有限，如果文章有誤還請指出，以免誤人。謝謝！?------------------

總結(jié)

以上是生活随笔為你收集整理的JavaScript高级程序设计学习笔记二（在HTML中使用JavaScript）的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。