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