Question

StackOverflow和其他网站上有很多关于避免命名空间冲突问题的帖子。在我的场景中，我只想在可访问DOM之后执行JavaScript中的方法。

如果我执行以下操作，它会避免命名空间冲突吗？

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

如果稍后注入的脚本也设置了onload函数怎么办？我的会被覆盖吗？我完全知道我可以测试一下，但我也想要一些反馈，因为我是JavaScript的新手，可能还有其他一些场景会做我不知道的事情。

编辑：我只需要支持Safari 5.0 +

Answer 1

是的，最后一个将覆盖之前的那个。

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

Answer 2

这是一种很好的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

Answer 3

有很多关于此的信息，但这是简短的版本：

如果你想与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事件函数来处理这个逻辑。

Answer 4

它会被覆盖。在Javascript中，当你定义像

这样的句柄事件时

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

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

这将使“assign”window.onload =＆gt; function（）。 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使回调不是“赋值”。希望它可以帮到你。

如果多个脚本设置window.onload会发生什么？

4 个答案: