JavaScript判斷頁面加載完之后再執(zhí)行預定函數的技巧_javascript技巧

2、的是，當事件處理與對應元索綁定起來的吋候，只冇在那個元索加載完Z后才能進行操作。如杲說把處理的腳木放在了head區(qū)域，瀏覽器會報錯。因為下而的HTML元素述沒冇加載出來，head中的處理腳本已經被處理了。一個好的執(zhí)行JavaScript代碼的方法應該是行為內容分離的、在頁面加載后處理的。所以，處理JavaScript代碼我們要用到監(jiān)聽器和window對象的load事件。監(jiān)聽器監(jiān)聽器實際上的功能就是行為與內容分離的。以前需要在HTML屮加上一些觸發(fā)事件來觸發(fā)JavaScript的相關函數，而現在直接在JavaScript中對某個元素的使用監(jiān)聽器，監(jiān)聽這個元素的事件，如果這個元

3、素被觸發(fā)了某些事件，在監(jiān)聽器中又定義了這個事件對應的處理函數，那么就會處理這個函數。W3C的標準方法叫做addEvcntListoner,被IE9,chrome,firefox,opera所支持，寫法：window.addEventListener('load',function,false);早期IE中有attachEvcnt方法效果類似:window,attachEvent('onload',function);使用監(jiān)聽器的方法也很簡單，就是先獲取頁而屮的某個元素，然后對這個元素使用監(jiān)聽器，定義監(jiān)聽的事件和對應的事件處理函數，就上文例子：document.getElem

4、entById('link').addEventListener('click',fun,false)f關于監(jiān)聽器更加詳細的使用說明，請見文末補充資料。window,onload事件onload事件只有在整個頁面已經完全載入的時候才會被觸發(fā)，我們將JavaScript代碼寫進onload事件中,就可以保證在HTML元素被加載完成之后，瀏覽器才會處理我們的JavaScript代碼。基礎的寫法:window?onload=function(){//code}這樣，這個函數里而的code會在加載完成Z后被處理。但是，這種方法冇個缺陷，就是只能用于這一個函數。頁而屮無法出現多個wi

5、ndow,onload事件，如果出現了多個onload事件，那么后面的內容會覆蓋前面的。那么，我們可以這樣做，在一個window,onload事件屮，寫上所有需要加載的函數名，然后在外面定義函數：window.onload=function(){fund();func2();}functionfuncl(){???}functionfunc2(){???}這樣做雖然可以，但是很不方便，因為我們需要把所自要加載的函數名都寫進去,修改起來就會很麻煩。當然辦法肯定是有的，jQuery就特別提供了很強大的多腳本加載方法，那么原生的JavaScript肯定也有辦法。window,on

6、load同時處理多個函數我們需要編寫一個處理函數，先看一下代碼：funclionaddLoadListener(fn){if(typeofwindow.addEventListener!="undefined'){window.addEventListener('load',fn,false);}elseif(typeofdocument.addEventListener!=^undefined"){document.addEventListener('load',fn,false);}elseif(typeofwindow,attachEvent!二'undefined，

7、){window.attachEvent('onloacT,fn);}else{varoldfn=window,onload;if(typeofwindow,onload!="function'){window,onload二fn;}else{window.onload二function(){oldfn();fn();}；}簡單的來解析一下，這個自定義的addLoadListener函數，傳遞一個函數名稱作為參數。它首先判斷瀏覽器是否支持相關的監(jiān)聽器，如果支持監(jiān)聽器，就使用監(jiān)聽器監(jiān)聽window對彖的onload事