關於script的async屬性

來源:互聯網
上載者:User

 script標籤有一個很不常用的 async 屬性,這個屬性最早是由FireFox先搞出來的,然後得到了 Chrome 和 Safari 的支援,但是很不幸的是IE不支援該屬性。

關於async的介紹可以見這裡:http://www.w3.org/TR/html5/scripting-1.html#attr-script-async

async 屬性我們大致可以這樣去理解:

     當script的 async 屬性被置為 true 時,指令碼的執行序為非同步。即不按照掛載到 Dom 的序順執行 ,相反如果是 false 則按掛載的順序執行。

     如果script標籤被直接編碼到html中,那黙認的async屬性為 false ,如果script 是由 document.createElement("script")得到,那麼 async 屬性為 true

IE、Safari和Opera是完全不鳥這個屬性了,如果是動態建立script標籤,Opera會按script 掛到Dom的序順依次執行,但是 IE瀏覽器和 Safari 此時很不給力了非同步執行了。

那麼這裡就會產生一個問題, 我們有一個動態載入JavaScript的需求,而且是隨時都有可能動態載入一個或多個Javascript指令碼,而且這個載入一定是跨域的。使用 xhr (動態載入JavaScript代碼)注入的方式肯定是不能考慮了。那如何做到並序下載按序執行呢?

我們可以嘗試這種辦法,首先我們使用一個type="text/seed"的script標籤把所有指令碼下載下來,你也可以設定成任意你想設定的東西 text/someelse  當然不能寫javascript了。完成所有的指令碼下載後,再依序重建script標籤,並把標籤掛入到Dom樹之中。

這相當於利用瀏覽器的cache把檔案預先載入進來,然後再一個個執行。但是這個方案卻是一個沒有理論基礎的,因為我不知道瀏覽器會怎麼利用cache。但是目前所測試的瀏覽器上都達到了預期的結果。

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.