js 延遲加載 改變JS的位置加快網(wǎng)頁加載速度
更新時間：2012年12月11日 16:43:22 作者：
當一個網(wǎng)站有很多js代碼要加載，js代碼放置的位置在一定程度上將會影像網(wǎng)頁的加載速度,為了提高加載速度，本文總結(jié)了一下幾個注意點
當一個網(wǎng)站有很多js代碼要加載，js代碼放置的位置在一定程度上將會影像網(wǎng)頁的加載速度，為了讓我們的網(wǎng)頁加載速度更快，本文總結(jié)了一下幾個注意點：
1、延遲加載js代碼
<script type=”text/javascript” src=”" id=”my”></script>
<script type=”text/javascript”>
setTimeout(“document.getElementById(‘my').src='include/php100.php'; “,3000);//延時3秒
</script>
這樣通過延遲加載js代碼，給網(wǎng)頁加載留出更多的時間！
2、js最后加載方案一
在需要插入JS的地方插入以下代碼:
程序代碼
<span id=”L4EVER”>LOADING…</span>
當然,那個LOADING…你可以換成自己喜歡的小圖片.看起來很有AJAX效果呢.
然后在頁面最底端插入:
程序代碼
<span id=”AD_L4EVER”>你的JS代碼在這里!</span >
<script>L4EVER.innerHTML=AD_L4EVER.innerHTML;AD_L4EVER.innerHTML=”";</script>
3、讓JS最后加載方案二
這個牽涉到網(wǎng)頁的加載順序問題，例如引入外部js腳本文件時，如果放入html的head中,則頁面加載前該js腳本就會被加載入頁面，而放入body中，則會按照頁面從上倒下的加載順序來運行javascript的代碼~~~ 所以我們可以把js外部引入的文件放到頁面底部，來讓js最后引入，從而加快頁面加載速度。
1、延遲加載js代碼
復(fù)制代碼 代碼如下:
<script type=”text/javascript” src=”" id=”my”></script>
<script type=”text/javascript”>
setTimeout(“document.getElementById(‘my').src='include/php100.php'; “,3000);//延時3秒
</script>
這樣通過延遲加載js代碼，給網(wǎng)頁加載留出更多的時間！
2、js最后加載方案一
在需要插入JS的地方插入以下代碼:
程序代碼
復(fù)制代碼 代碼如下:
<span id=”L4EVER”>LOADING…</span>
當然,那個LOADING…你可以換成自己喜歡的小圖片.看起來很有AJAX效果呢.
然后在頁面最底端插入:
程序代碼
復(fù)制代碼 代碼如下:
<span id=”AD_L4EVER”>你的JS代碼在這里!</span >
<script>L4EVER.innerHTML=AD_L4EVER.innerHTML;AD_L4EVER.innerHTML=”";</script>
3、讓JS最后加載方案二
這個牽涉到網(wǎng)頁的加載順序問題，例如引入外部js腳本文件時，如果放入html的head中,則頁面加載前該js腳本就會被加載入頁面，而放入body中，則會按照頁面從上倒下的加載順序來運行javascript的代碼~~~ 所以我們可以把js外部引入的文件放到頁面底部，來讓js最后引入，從而加快頁面加載速度。
相關(guān)文章
這篇文章介紹了ES6新增的關(guān)鍵字let和const，文中通過示例代碼介紹的非常詳細。對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值，需要的朋友可以參考下2022-03-03
JavaScript基本概念初級講解論壇貼的學(xué)習(xí)記錄
JavaScript基本概念 論壇貼建議大家看下，都是一些js的高級的技巧知識小結(jié)。2009-02-02
這篇文章主要介紹了Javascript快速排序算法的相關(guān)資料,需要的朋友可以參考下2014-12-12
這篇文章主要介紹了forward和redirect的區(qū)別,在前端開發(fā)中,有很多剛?cè)胄械呐笥巡涣私膺@兩者之間的區(qū)別,那么這篇文章可以帶給你新的認知,需要的朋友可以參考下2023-03-03
Document.location.href和.replace的區(qū)別示例介紹
document.location.href和document.location.replace都可以實現(xiàn)從A頁面切換到B頁面，下面為大家介紹下它們的區(qū)別2014-03-03
淺談JavaScript數(shù)據(jù)類型及轉(zhuǎn)換
本文向大家簡單介紹了javascript的數(shù)據(jù)類型以及他們直接的轉(zhuǎn)換方法，雖然沒有太多示例，但是也是個人的一些經(jīng)驗總結(jié)，這里推薦給大家。2015-02-02
這篇文章主要介紹了javascript判斷office版本示例,需要的朋友可以參考下2014-04-04
字符長度限制在某些特殊的使用場合還是比較實用的，下面為大家用示例探討下，感興趣的朋友可以參考下2014-01-01
本文使用JS、CSS、標簽屬性等方式去除IE鏈接上的虛線框，方法很簡單，大家可以選擇使用2013-11-11
javascript學(xué)習(xí)筆記(十三) js閉包介紹(轉(zhuǎn))
閉包（closure）是Javascript語言的一個難點，也是它的特色，很多高級應(yīng)用都要依靠閉包實現(xiàn)2012-06-06