在 <body> 部分通过 javascript 为 body.onload 添加事件处理程序
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/5082165/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Add event handler for body.onload by javascript within <body> part
提问by Daniel B?hmer
We want to include a maps from Google Maps API in our document. The documentation tells to initialize the map with a function called by the onload() event of the body.
我们希望在我们的文档中包含来自 Google Maps API 的地图。该文档告诉使用主体的 onload() 事件调用的函数来初始化映射。
The ordinary way to call:
普通调用方式：
<body onload="initialize_map();">
This doesn't work out for us because we're using Template::Toolkit and the <body>tag is already included in our wrapper. In short: The <body>tag is already printed when our javascript code starts running.
这对我们不起作用，因为我们使用 Template::Toolkit 并且<body>标签已经包含在我们的包装器中。简而言之：<body>当我们的 javascript 代码开始运行时，标签已经打印出来了。
I tried something like this but it does only work for onclick, not onload. I guess that's because the javascript code is beneath the <body>tag itself.
我试过这样的事情，但它只适用于onclick，而不适用于onload。我猜这是因为 javascript 代码位于<body>标签本身之下。
var body = document.getElementsByTagName("body")[0];
body.addEventListener("load", init(), false);
function init() {
alert("it works!");
};
Any help how to fire up a Google Maps map appreciated!
任何有关如何启动 Google Maps 地图的帮助表示赞赏！
采纳答案by Daniel B?hmer
As we were already using jQuery for a graphical eye-candy feature we ended up using this. A code like
由于我们已经将 jQuery 用于图形化养眼的功能，因此我们最终使用了它。像这样的代码
$(document).ready(function() {
// any code goes here
init();
});
did everything we wanted and cares about browser incompatibilities at its own.
做了我们想做的一切，并关心浏览器的不兼容性。
回答by epascarello
body.addEventListener("load", init(), false);
That init() is saying run this function now and assign whatever it returns to the load event.
init() 是说现在运行这个函数并将它返回的任何内容分配给加载事件。
What you want is to assign the reference to the function, not the result. So you need to drop the ().
您想要的是将引用分配给函数，而不是结果。所以你需要去掉 ()。
body.addEventListener("load", init, false);
Also you should be using window.onload and not body.onload
你也应该使用 window.onload 而不是 body.onload
addEventListeneris supported in most browsers except IE 8.
addEventListener除了 IE 8 外，大多数浏览器都支持。
回答by Jacob Lauritzen
You should really use the following instead (works in all newer browsers):
您应该真正使用以下内容（适用于所有较新的浏览器）：
window.addEventListener('DOMContentLoaded', init, false);
回答by Mark Rhodes
As @epascarello mentioned for W3C standard browsers, you should use:
正如@epascarello 提到的 W3C 标准浏览器，您应该使用：
body.addEventListener("load", init, false);
However, if you want it to work on IE<9 as well you can use:
但是，如果您希望它也适用于 IE<9，则可以使用：
var prefix = window.addEventListener ? "" : "on";
var eventName = window.addEventListener ? "addEventListener" : "attachEvent";
document.body[eventName](prefix + "load", init, false);
Or if you want it in a single line:
或者，如果您希望将其放在一行中：
document.body[window.addEventListener ? 'addEventListener' : 'attachEvent'](
window.addEventListener ? "load" : "onload", init, false);
Note: here I get a straight reference to the body element via the document, saving the need for the first line.
注意：这里我通过文档直接引用了 body 元素，省去了第一行的需要。
Also, if you're using jQuery, and you want to use the DOM readyevent rather than when the body loads, the answer can be even shorter...
此外，如果您使用的是 jQuery，并且您想使用DOM ready事件而不是 body 时load，那么答案可能会更短......
$(init);
回答by Moses
Simply wrap the code you want to execute into the onload event of the window object:
只需将要执行的代码包装到 window 对象的 onload 事件中即可：
window.onload = function(){
// your code here
}
