async和DOM Script文件加載比較
目前我用demo.js作為執(zhí)行文件操作.代碼：
var now = function() { return +(new Date()); }
var t_s = now();
while(now() - t_s < 2000) { }
用sleep.php作為請(qǐng)求文件操作。代碼：
<?php sleep(3); echo 'var bb'; ?>
1. 一般script標(biāo)簽加載
<script src="demo.js"></script> <script src="sleep.php"></script>
在瀏覽器加載情況: 圖1-1. 下載阻塞DomReady 圖1-2. 執(zhí)行阻塞DomReady
圖1-1. 下載阻塞DomReady
圖1-2. 執(zhí)行阻塞DomReady
2. async屬性
async是html5中新增的屬性，它的作用是能夠異步下載腳本文件，不阻塞DOMReady。
每一個(gè)async屬性的腳本都在它下載結(jié)束之后立刻執(zhí)行，同時(shí)會(huì)在window的load事件之前執(zhí)行。所以就有可能出現(xiàn)腳本執(zhí)行順序被打亂的情況
支持async瀏覽器: Firefox 3.6+, IE 10+, Chrome 2+, Safari 5+, iOS 5+, Android 3+
<script src="demo.js" async></script> <script src="sleep.php" async></script>
在瀏覽器中加載的情況：
圖2-1 異步下載 不阻塞DomReady 阻塞load事件
圖2-2 執(zhí)行阻塞load事件
圖2-3 IE9不支持async屬性下載阻塞DomReady
3. DOM Script動(dòng)態(tài)加載
文檔對(duì)象模型（DOM）允許您使用 JavaScript 動(dòng)態(tài)創(chuàng)建 HTML 的幾乎全部文檔內(nèi)容。 script元素與頁面其他元素一樣，可以非常容易地通過標(biāo)準(zhǔn) DOM 函數(shù)創(chuàng)建：
var loadScript = function(url) {
var s = document.createElement('script');
s.type = 'text/javascript';
s.async = 'true';
s.src = url;
document.getElementsByTagName('head')[0].appendChild(s);
}
// 加載js文件腳本
loadScript('sleep.php');
loadScript('demo.js');
在瀏覽器中加載的情況：
圖3-1 下載阻塞load事件
圖3-2 執(zhí)行阻塞load事件
圖3-3 IE9不阻塞load事件
小結(jié)
async和script動(dòng)態(tài)加載在現(xiàn)代瀏覽器中加載的情況是一致的。前者使用簡(jiǎn)單，后在兼容性方面更好。 異步加載文件還有很多方法，ajax(會(huì)受到同源限制)、iFrame、img…
相關(guān)文章
Ping服務(wù)的php實(shí)現(xiàn)方法,讓網(wǎng)站快速被收錄
這篇博文繼續(xù)說說這個(gè)ping服務(wù)的問題，首先歸納和總結(jié)以下資料2012-02-02
偽靜態(tài)技術(shù)通過將動(dòng)態(tài)URL轉(zhuǎn)換為靜態(tài)樣式,不僅提高了用戶體驗(yàn),也增強(qiáng)了搜索引擎的抓取效率,本文將詳細(xì)介紹什么是偽靜態(tài),以及如何在?PHP中實(shí)現(xiàn)偽靜態(tài),需要的可以了解下2024-11-11
php 不使用js實(shí)現(xiàn)頁面跳轉(zhuǎn)
頁面跳轉(zhuǎn)大多情況下是使用js，其實(shí)也可以不用，下面為大家介紹下具體的實(shí)現(xiàn),需要的朋友可以參考下2014-02-02
這篇文章主要介紹了php使用codebase生成隨機(jī)數(shù)的示例,需要的朋友可以參考下2014-03-03
用php將任何格式視頻轉(zhuǎn)為flv的實(shí)現(xiàn)代碼，大家可以參考下。2009-09-09
作者：老王 如果和MSSQL的TOP語法相比，那么MySQL的LIMIT語法要顯得優(yōu)雅了許多。使用它來分頁是再自然不過的事情了。2008-06-06
解析thinkphp import 文件內(nèi)容變量失效的問題
本篇文章是對(duì)thinkphp import文件內(nèi)容變量失效的問題進(jìn)行了詳細(xì)的分析介紹，需要的朋友參考下2013-06-06
這篇文章主要介紹了php格式化電話號(hào)碼的方法,涉及php正則表達(dá)式的相關(guān)技巧,需要的朋友可以參考下2015-04-04
PHP如何根據(jù)文件頭檢測(cè)文件類型實(shí)例代碼
這篇文章主要給大家介紹了關(guān)于PHP如何根據(jù)文件頭檢測(cè)文件類型的相關(guān)資料，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家學(xué)習(xí)或者使用php具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2018-10-10
按位與主要是對(duì)二進(jìn)制數(shù)操作，下面為大家介紹下PHP中的按位與和按位或的操作，希望對(duì)大家有所幫助2014-01-01