Javascript 在HTML中使用Javascript

第二章講的是如何將Javascript引入HTML

<script>

<script>有以下屬性:

  • async 只對外部文件有效,表示立即下載,不妨礙頁面其他操作
  • defer 只對外部文件有效, 表示立即下載,不妨礙頁面其他操作
  • charset 字符集
  • language 已廢棄
  • src 表示外部文件
  • type 編寫代碼使用的腳本語言的內(nèi)容類型(即MIME類型),默認(rèn)為text/javascript

<script>有兩種使用方式:

  • 頁面中嵌入,需要指定type屬性,注意嵌入的代碼中不能包含</script>字符串,如需包含,請先轉(zhuǎn)義(<\/script>)。在解釋器對其中代碼求值完畢以前,頁面剩余內(nèi)容不會被加載顯示。
  • 包含外部文件,需要指定src屬性代表外部文件的位置,瀏覽器不會檢查包含Javascript文件的擴展名,因此可以使用PHP、JSP等動態(tài)生成Javascript,如果不使用擴展名,請確保服務(wù)器返回正確的MIME類型。此時<script></script> 之間的代碼會被忽略。
    這里作者還提到了Javascript會阻塞頁面加載渲染,之前寫過一篇文章,可參考:
    HTML 加載過程
標(biāo)簽的位置

傳統(tǒng)做法,是將Javascript的加載放在<head>標(biāo)簽內(nèi),但這種做法會使界面呈現(xiàn)(<body>標(biāo)簽)發(fā)生在所有Javascript加載、解析、執(zhí)行完畢之后,嚴(yán)重影響用戶體驗,因此推薦將<script>標(biāo)簽放在</body>之前。

延遲腳本(defer

被標(biāo)注defer屬性的腳本需立即下載,但要等到整個頁面解析完畢后再執(zhí)行。即使腳本放在<head>中,也會在</html>之后按出現(xiàn)的先后順序執(zhí)行(按順序執(zhí)行僅僅是HTML5的規(guī)范)

異步腳本(async)

異步腳本同延遲腳本類似,只是不保證腳本按順序執(zhí)行,asyncdefer的目的是不讓Javascript的下載和執(zhí)行堵塞頁面其他內(nèi)容。
關(guān)于asyncdefer之后章節(jié)會有詳細(xì)講述

在XHTML的用法(略,以后會找時間學(xué)習(xí)XHTML,這里不做筆記)
不推薦使用的語法(略)

嵌入代碼與外部文件

一般認(rèn)為最好使用外部文件來引入Javascript代碼,有如下優(yōu)點:

  • 可維護(hù)性 可專心地、不觸及HTML標(biāo)簽地、統(tǒng)一地更改Javascript代碼
  • 可緩存
  • 可重用(筆者自己加的,由書中的 可緩存 擴展而來)兩個HTML文件可使用同一個Javascript文件。
  • 適應(yīng)未來 HTML和XHTML包含外部文件的語法是相同的。

文檔模式

IE5.5引入的概念,通過doctype實現(xiàn)切換。
如果文檔開始時不聲明,所有瀏覽器默認(rèn)開啟混雜模式,但是不推薦,因為不同了瀏覽器這種模式下行為差距很大,推薦使用標(biāo)準(zhǔn)模式或準(zhǔn)標(biāo)準(zhǔn)模式。
標(biāo)準(zhǔn)模式:

標(biāo)準(zhǔn)模式

準(zhǔn)標(biāo)準(zhǔn)模式:


準(zhǔn)標(biāo)準(zhǔn)模式

zhunbia
標(biāo)準(zhǔn)模式與準(zhǔn)標(biāo)準(zhǔn)模式的差異幾乎可以忽略不計。

<noscript>

當(dāng)瀏覽器不支持Javascript腳本或者Javascript腳本被禁用時該怎么辦呢?我們可以使用<noscript>來顯示替代內(nèi)容,任何可以添加在<body>中的HTML元素(除<script>)都可以添加在<noscript>

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容