窗口之间究竟有什么区别。Onload事件和body标签的Onload事件?我什么时候使用哪个，应该如何正确地做?
如果你试图编写不引人注目的JS代码(你应该)，那么你不应该使用<body onload="">。
这是我的理解，不同的浏览器处理这两个略有不同，但他们的操作相似。在大多数浏览器中，如果同时定义了两者，其中一个将被忽略。
一般来说，我更喜欢不使用<body onload="">事件。我认为尽可能地将行为与内容分离会更干净。
也就是说，在某些情况下(通常对我来说非常罕见)，使用身体负载可以轻微提高速度。
我喜欢使用Prototype，所以我通常把这样的东西放在我页面的<head>:
document.observe("dom:loaded", function(){
alert('The DOM is loaded!');
});
or
Event.observe(window, 'load', function(){
alert('Window onload');
});
以上是我在这里学到的技巧。我非常喜欢在HTML之外附加事件处理程序的概念。
(编辑以纠正代码中的拼写错误。)
它们的工作原理相同。但是，请注意，如果定义了两者，则只调用其中一个。我通常避免直接使用它们中的任何一个。相反，您可以将事件处理程序附加到加载事件。通过这种方式，你可以更容易地合并其他可能也需要附加回调到onload事件的JS包。
任何JS框架都有用于事件处理程序的跨浏览器方法。
窗口。onload= myOnloadFunc and <body onload="myOnloadFunc();>是使用同一事件的不同方式。使用窗口。onload没有那么突兀——它将JavaScript从HTML中剥离出来。
All of the common JavaScript libraries, Prototype, ExtJS, Dojo, JQuery, YUI, etc. provide nice wrappers around events that occur as the document is loaded. You can listen for the window onLoad event, and react to that, but onLoad is not fired until all resources have been downloaded, so your event handler won't be executed until that last huge image has been fetched. In some cases that's exactly what you want, in others you might find that listening for when the DOM is ready is more appropriate - this event is similar to onLoad but fires without waiting for images, etc. to download.
把onload看作任何其他属性。例如，在输入框中，你可以输入:
<input id="test1" value="something"/>
或者你可以拨打:
document.getElementById('test1').value = "somethingelse";
onload属性的工作方式与此相同，只不过它接受一个函数作为值，而不是像value属性那样接受一个字符串。这也解释了为什么你只能使用其中的一个——调用窗口。Onload为body标签重新分配Onload属性的值。
另外，就像其他人说的那样，通常将样式和javascript与页面内容分开会更干净，这就是为什么大多数人建议使用window。onload或类似jQuery的ready函数。
<body onload="">应该覆盖window.onload。
对于<body onload="">， document.body.onload可能是空的，未定义的或一个函数，这取决于浏览器(尽管getAttribute("onload")应该在某种程度上保持一致，以字符串形式获取匿名函数体)。与窗口。Onload，当你给它分配一个函数时，窗口。Onload将是一个跨浏览器一致的函数。如果这对你很重要，使用window.onload。
窗口。onload是更好的从你的内容分离JS。没有太多理由使用<body onload="">;不管怎样，你可以使用window。onload。
在Opera中，窗口的事件目标。Onload和<body Onload ="">(甚至窗口。addEventListener("load"， func, false))将是窗口，而不是像Safari和Firefox中的文档。但是，“this”将是跨浏览器的窗口。
这意味着，在重要的时候，您应该打包这些东西，使它们保持一致，或者使用一个为您做这件事的库。
两者没有区别，但两者都不能用。
在许多浏览器中，窗口。Onload事件不会触发，直到所有图像都已加载，这不是你想要的。基于标准的浏览器有一个名为DOMContentLoaded的事件，该事件较早触发，但IE不支持(在撰写本文时)。我建议使用支持跨浏览器DOMContentLoaded特性的javascript库，或者找到一个编写良好的函数。jQuery的$(document).ready()就是一个很好的例子。
对一个客观问题给出这么多主观答案。“低调”JavaScript是迷信，就像永远不要使用gotos的旧规则一样。以一种能够帮助您可靠地实现目标的方式编写代码，而不是按照某人流行的宗教信仰编写代码。
任何发现:
<body onload="body_onload();">
过分分散注意力是过分自命不凡的，而且没有明确自己的优先事项。
我通常把JavaScript代码放在一个单独的.js文件中，但我发现在HTML中挂钩事件处理程序并不麻烦，顺便说一下，这是有效的HTML。
窗口。Onload可以在没有身体的情况下工作。只使用脚本标记创建页面，并在浏览器中打开它。该页面不包含任何主体，但它仍然可以工作。
<script>
function testSp()
{
alert("hit");
}
window.onload=testSp;
</script>
窗口。onload -在所有DOM, JS文件，图像，Iframes，扩展和其他完全加载后调用。这等于$(window).load(function() {});
<body onload=""> - DOM加载后调用。这等于$(document).ready(function() {});
Sorry for reincarnation of this thread again after another 3 years of sleeping, but perhaps I have finally found the indisputable benefit of window.onload=fn1; over <body onload="fn1()">. It concerns the JS modules or ES modules: when your onload handler resides in "classical" JS file (i.e. referred without <script type="module" … >, either way is possible; when your onload handler resides in "module" JS file (i.e. referred with <script type="module" … >, the <body onload="fn1()"> will fail with "fn1() is not defined" error. The reason perhaps is that the ES modules are not loaded before HTML is parsed … but it is just my guess. Anyhow, window.onload=fn1; works perfectly with modules ...
推荐文章
- 在setInterval中使用React状态钩子时状态不更新
- 使用JavaScript显示/隐藏'div'
- 使用JavaScript获取所选的选项文本
- AngularJS模板中的三元运算符
- 让d3.js可视化布局反应灵敏的最好方法是什么?
- 原型的目的是什么?
- 检查jquery是否使用Javascript加载
- 将camelCaseText转换为标题大小写文本
- 如何在JavaScript客户端截屏网站/谷歌怎么做的?(无需存取硬盘)
- 如何在JavaScript中遍历表行和单元格?
- jQuery map vs. each
- 自定义异常类型
- 窗口。Onload vs <body Onload =""/>
- 不能与文件列表一起使用forEach
- Angular 2 Hover事件
