如果多個腳本設置了window.onload，會發生什麼情況？

在StackOverflow和其他網站上有關於避免命名空間衝突問題的文章。在我的場景中，我只想在JavaScript訪問DOM後執行JavaScript中的方法。如果多個腳本設置了window.onload，會發生什麼情況？

如果我這樣做，它會避免命名空間衝突？

<script type="text/javascript">window.onload = function() { //Define my namespace var here, and execute all my code }</script>

如果稍後注入的腳本也設置onload函數會怎麼樣？我會被覆蓋嗎？我完全意識到我可以測試這一點，但是我還需要一些反饋，因爲我是JavaScript新手，並且可能會有許多其他場景會做我不知道的事情。

編輯：我需要只支持Safari 5.0及

來源

2014-01-23 Kaizer Sozay

@Oriol是對的。既然你是新手......讓你的生活變得簡單...使用JQuery。不要誤解我的意思......學習JavaScript但通過JQuery學習它 – CodeHacker

焦點話題：請注意，如果您只想等到DOM準備就緒，您應該聽取'DOMContentLoaded'而不是'load'，它等待圖像加載完成。 – Oriol

是，最後一個將覆蓋前面的。

解決方案：使用新事件API：addEventListener。

來源

2014-01-23 02:54:09 Oriol

addEventListener將無法使用IE。如前所述，除非有一些不使用jQuery的特殊原因，否則使用jQuery $（window）.on（「load」，function（）{}）; –

@MaksymKozlenko不會只適用於舊版本的IE，現在它的使用率非常低。你認爲每個人都應該使用jQuery，但其他人（比如我）更喜歡其他框架，比如令人驚訝的快速[vanilla-js]（http://vanilla-js.com/）。 – Oriol

用匯編語言編寫代碼也更快，但我們大多數人都使用C++或JavaScript等高級語言。純JS很適合簡單的事情，但是當你的應用程序增長時，你需要使用一些框架來使你的代碼變得模塊化。不幸的是，舊的IE 7和8仍然是一個問題，因爲一些公司的IT部門懶得升級Windows或使用其他更符合標準的瀏覽器:-( –

這是一個很好的JavaScript的方式做正確的

function addLoadEvent(func) { 
var oldonload = window.onload; 
if (typeof window.onload != 'function') { 
    window.onload = func; 
} else { 
    window.onload = function() { 
    if (oldonload) { 
     oldonload(); 
    } 
    func(); 
    } 
} 
} 
addLoadEvent(nameOfSomeFunctionToRunOnPageLoad); 
addLoadEvent(function() { 
    /* more code to run on page load */ 
});

Explained Source

來源

2014-01-23 03:03:41 CodeHacker

問題是，如果提交者無法控制腳本，不要使用這段代碼，並且會重寫他的事件監聽器。 – Oriol

有大量的信息，這一點，但這裏的短版：如果你想與發揮很好

onload，你可以做

var prev_onLoad = window.onload; 
window.onload = function() { 
    if (typeof(prev_onLoad)=='function') 
     prev_onLoad(); 

    // rest of your onLoad handler goes here 
}

並希望其他的很好地播放或確保這是代碼中onload的最後設置。

但是，更現代的瀏覽器具有事件註冊功能（IE上的addEventListener和attachEvent），它負責處理這種鏈接。已經編寫了很多跨瀏覽器onload事件函數，它們會爲您處理這些邏輯。

來源

2014-01-23 03:11:11 Amnon

它會被覆蓋。在Javascript中，當你定義處理事件像

window.onload = function(){ 
    console.log("in Load function 1"); 

}; 
window.onload = function(){ 
    console.log(" In load function 2"); 
};

這將使一個「分配」的window.onload =>（）函數。並且window.onload將被分配給最後一個函數。

但在jQuery的，可以在多次處理事件和瀏覽器會讓所有

$("body").on("click",function(){ 
console.log("make a callback function 1"); 
}); 
$("body").on("click",function(){ 
console.log("make a callback function 2"); 
});

因爲jQuery做一個回調不是「分配」。希望它可以幫助你。

來源

2014-01-23 03:13:09 LogPi

如果多個腳本設置了window.onload，會發生什麼情況？

回答

相關問題