Javascript 替代 <body onload="init ();">
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/7561315/
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
Alternative to <body onload="init ();">
提问by firefusion
I'm trying to fix an old script written for me. I need it to run without <body onload="init ();">. I'd like to run the function from inside the script without inline code like that command. Sorry I'm not a JS expert but how do I do this?
我正在尝试修复为我编写的旧脚本。我需要它在没有<body onload="init ();">. 我想从脚本内部运行该函数，而无需像该命令那样的内联代码。抱歉，我不是 JS 专家，但我该怎么做？
回答by Brad
<script type="text/javascript">
function init() {
// Put your code here
}
window.onload = init;
</script>
Or, if you are using jQuery:
或者，如果您使用的是 jQuery：
$(function() {
// Your code here
});
回答by Tejs
In a pure JavaScript implementation, you'd want to wait for the page to be ready to invoke your events. The simplest solution is like so:
在纯 JavaScript 实现中，您需要等待页面准备好调用您的事件。最简单的解决方案是这样的：
<script type="text/javascript" language="javascript">
window.onload = function()
{
init();
};
</script>
But that's not much better than your original implementation via placing that on the tag itself. What you can do is wait for a specific event though:
但这并不比通过将其放置在标签本身上的原始实现好多少。您可以做的是等待特定事件：
document.addEventListener("DOMContentLoaded", function()
{
init();
}, false);
This should be fired a little earlier in the cycle and should do nicely.
这应该在周期的早些时候触发，并且应该做得很好。
Additionally, if you are using jQuery, you can simply add a function to be executed when that event is fired using the simple syntax:
此外，如果您使用的是 jQuery，您可以使用简单的语法简单地添加一个要在触发该事件时执行的函数：
$(document).ready(function() // or $(function()
{
init();
});
回答by user2397294
Here's a slight variation on Tejs' response. I often find it more readable and manageable to separate the init() function from the code registering the event handler:
这是 Tejs 回应的一个细微变化。我经常发现将 init() 函数与注册事件处理程序的代码分开更易读和易于管理：
function init(e) {
//statements...
}
document.addEventListener('DOMContentLoaded', init, false);
Also, in place of an explicit init() function, I've sometimes used a self-executing anonymous function placed at the very, very bottom of the page, just before the </body>tag:
此外，为了代替显式的 init() 函数，我有时会使用一个自执行匿名函数，该函数放置在页面的非常非常底部，就在</body>标记之前：
(function() {
//statements...
})();
回答by Marc B
best option is to just put the call to init()at the bottom of the page:
最好的选择是将调用放在init()页面底部：
<html>
<head>
...
</head>
<body>
.... page content here ...
<script type="text/javascript">init();</script>
</body>
</html>
By placing it at the bottom like that, you'll be sure that it runs as pretty much the very last thing on the page. However, note that it's not as reliable as using the onload option in the body tag, or jquery's $('document').ready()or mootool's window.addEvent('domready', ...).
通过将它像这样放在底部，您将确保它几乎像页面上的最后一样运行。但是，请注意，它不如在 body 标签中使用 onload 选项或 jquery$('document').ready()或 mootool 的window.addEvent('domready', ...).
回答by Raja Ram T
<script type="text/javascript">
function init() {
// Put your code here
}
window.onload = init;
</script>
it is not work should be use this
这是行不通的，应该使用这个
<script type="text/javascript">
function init() {
// Put your code here
}
window.onload = init();
</script>
