|
|
|
|
|
|
onload js函數不執行的原因分析及解決方法
作者:admin 時間:2012-11-14 23:9:1 瀏覽:今天打開網站的時候，發現很多頁面的信息都沒有顯示出來，仔細觀察了之后，發現都是onload的js函數沒有執行的原因。其實之前曾發現過這個情況，我以為是網站出了問題，然后采用多種方法試圖讓onload的js能夠執行，又是重新生成網頁、又是重啟站點、重啟IIS，甚至重啟服務器都干過，我的想法是可能網頁速度太慢了而導致沒有執行onload的js函數。
onload js函數不執行的原因分析及解決方法
今天又出現此問題之后，我不再盲目的操作了。我發現最近Google的統計代碼加載很慢，經常在瀏覽器狀態欄里看到Google的統計代碼鏈接在運行，而就在這個過程，導致網頁被k住了。我細心觀察了下，不但是Google的分析程序，還有Google AdSense的鏈接、百度聯盟的鏈接等第三方js代碼都時不時出現這個問題，就是被k住了不能加載聯盟廣告，繼而網頁也不能繼續加載其他的東西，包括onload的js函數的執行。
點擊上圖放大
受這個啟示，我首先把Google的統計分析代碼去掉，然后打開網頁，看看是否可以執行onload的js函數；如果不行，再把AdSense的聯盟廣告代碼去掉，然后測試顯示效果；如果還不行，就再把百度聯盟廣告的代碼去掉，看是否解決問題。一般情況下，經過這三個步驟，onload的js函數不能執行的問題就可以解決了。
實際上，在遇到這個問題是，我們只需注意一下狀態欄里哪個地址的執行最久，哪個地址就是禍根了，把它去掉即可。如果是站內圖片，則需要優化一下了，找出其加載慢的原因從而解決問題。
onload的js函數是在網頁加載完畢后才執行
我一直不是很清楚，我以為onload的js函數是在網頁打開的時候就執行了的，實際上，onload的js函數是在網頁加載完畢后才執行，即它是網頁最后才執行的函數。
了解了這個之后，我們就能理解為什么有時候onload的js函數沒有執行了，原因很簡單，因為網頁有個別地方沒有加載完，被k住哪里了。
JQuery的$(window).load()與OnLoad事件比較
JQuery的$(window).load()方法與OnLoad事件，很大的區別就是執行的順序不同。
對于Body.Onload事件，是在加載完所有頁面內容才會觸發，我的意思是所有內容,包括圖片，flash等.如果頁面的這些內容很多會讓用戶等待很長時間。
而對于$(document).ready()方法，這個方法只是在頁面所有的DOM加載完畢后就會觸發，無疑很大的加快了網頁的速度。
但是對于一些特殊應用，比如圖片的放大縮小，圖片的剪裁。需要網頁所有的內容加載完畢后才執行的呢？我推薦使用$(window).load()方法，這個方法會等到頁面所有內容加載完畢后才會觸發，并且同時又沒有OnLoad事件的弊端。
<script type="text/javascript">
$(window).load(function() {
alert("hello");
});
$(window).load(function() {
alert("hello again");
});
</script>
上面的代碼會在頁面所有內容加載完成后按先后順序依次執行。
當然不要忘了與之對應的Unload方法：
$(window).unload(function() {
alert("good bye");
});
上面代碼會在頁面關閉時引發。
在所有DOM加載之前引發JS代碼，這個方法是我在調試的時候最喜歡的，有時候開發的時候也用這種方法。
<body>
<script type="text/javascript">
(function() {
alert("hi");
})(jQuery)
</script>
</body>
對，就是利用js閉包的形式將js代碼嵌入body，這段代碼會自動執行，當然也可以直接嵌入js代碼,這種方式要注意順序問題，如下：
<body>
<div id="test">this is the content</div>
<script type="text/javascript">
alert($("#test").html());//I Can display the content
</script>
</body>
<body>
<script type="text/javascript">
alert($("#test").html());//I Can't display the content
</script>
<div id="test">this is the content</div>
</body>
上面兩段代碼，第二段代碼當中因為只能解釋到當前代碼之前的DOM，而test并不存在于已經解析的DOM數，所以第二段代碼無法正確顯示。
標簽: onload
