dom events - 如何在页面加载完成时从 HTML 文档正文调用 JavaScript 函数

dom events - How to call JavaScript function from body of HTML document on pageload-complete

本文关键字：文档 HTML 正文 调用 函数 JavaScript 完成时 加载 events dom      更新时间：2023-09-26

我有一些JavaScript（如果你有兴趣，可以初始化谷歌地图的代码），我被迫包含在html文档的<body></body>标签中，我想让我的方法之一在页面加载完成时触发。问题是我无法访问 <body> html 标签，所以我不能这样做：

<body onload="foo()">

有什么办法可以做到这一点吗？我意识到这是一个荒谬的场景。

根据代码的运行时间，使用 JavaScript 附加处理程序：

if(window.onload) {
    var _existing = window.onload;
    window.onload = function() {
        _existing();
        foo();
    };
}
else {
    window.onload = foo;
}

由于您似乎无法控制页面，因此我们必须更加小心。其他 JavaScript 可能已经设置了事件处理程序。为了成为一个好公民，我们不只是覆盖事件处理程序，而是保留对它的引用，以防它存在。

但是，其他JavaScript代码可能会再次覆盖它。

最好的方法是使用更高级的事件处理方法addEventListener （W3C） 和 attachEvent （IE）。

有关

事件处理的更多信息，我建议阅读有关 quirksmode.org 的优秀文章。

如果你使用的是jQuery，你可以使用$(document).ready：

 $(document).ready(function() {
   // put all your jQuery goodness in here.
 });

请参阅本教程。

window.onload = foo;
function foo(){
  alert("page loaded!");
}

您可以使用 DOM 以编程方式附加事件。

// Function to add event listener to body 
function addLoadFn() 
{ 
   var body = document.getElementById("body"); 
   body.addEventListener("load", myOnloadListener, false); 
}
相关文章：