window.onload vs <body onload =""/>

Question

window.onload vs <body onload =""/>

window.onload事件与标签onload事件之间究竟有什么区别body？我何时使用哪个以及如何正确使用？

Answer 1

window.onload = myOnloadFunc并且<body onload="myOnloadFunc();">是使用相同事件的不同方式.window.onload虽然使用不那么突兀 - 它会将你的JavaScript从HTML中删除.

所有常见的JavaScript库,Prototype,ExtJS,Dojo,JQuery,YUI等都为文档加载时发生的事件提供了很好的包装.您可以侦听窗口onLoad事件,并对此作出反应,但是在下载所有资源之前不会触发onLoad,因此在获取最后一个巨大的图像之前不会执行事件处理程序.在某些情况下,这正是您想要的,在其他情况下,您可能会发现在DOM准备好时进行监听更合适 - 此事件类似于onLoad,但无需等待图像等即可下载.

然而,应该指出的是,存在差异.内联onload事件将在全局上下文中调用`myOnloadFunc()`(`this`将引用`window`).通过javascript设置它将使它在元素的上下文中执行(`this`指的是触发事件的元素).在这种特殊情况下,它不会产生任何影响,但它会与其他元素有所不同. (54认同)

Answer 2

jca*_*ll1 32

没有区别,但你不应该使用它们.

在许多浏览器中,window.onload直到所有图像都加载后才会触发事件,这不是您想要的.基于标准的浏览器有一个事件被称为DOMContentLoaded更早发生的事件,但IE不支持它(在撰写本答案时).我建议使用支持跨浏览器DOMContentLoaded功能的javascript库,或者找到一个可以使用的编写良好的函数.jQuery $(document).ready()是一个很好的例子.

现在的问题..如果jQuery对手头的项目来说太过分了怎么办？(不要敲jQuery,自己使用它.有时只需要一个库中的一个功能..) (53认同)
来自未来的问题......如果没有jquery怎么办？ (50认同)
当你说"不支持IE"时,这是一个普遍的事实,还是仅适用于特定版本的IE？既然你写了这个答案后,浏览器世界发生了很多变化,也许是时候更新这个答案了？ (14认同)
IE9及更高版本现在支持DOMContentLoaded:https://developer.mozilla.org/en-US/docs/Web/Events/DOMContentLoaded (8认同)
从未来的报告中,DOMContentLoaded现在受到所有主流浏览器的支持:http://caniuse.com/#feat=domcontentloaded (6认同)
@Sid永远不会有"没有jQuery",因为它目前存在.你总是可以自己主持它.还有jcampbell1你怎么知道这不是OP想要的？ (2认同)
对于像这样的一些功能来说，jQuery 毫无意义，你可以用它做的任何事情都可以用普通 JS 做。 (2认同)

Answer 3

小智 20

window.onload可以没有身体工作.创建仅包含脚本标记的页面,并在浏览器中打开它.该页面不包含任何正文,但它仍然有效..

<script>
  function testSp()
  {
    alert("hit");
  }
  window.onload=testSp;
</script>

Run Code Online (Sandbox Code Playgroud)

如果您确实添加了内容(应该在body标签中),那么没有body标签的HTML将无效.您的脚本标记也缺少类型.永远不要依赖浏览器来修复不符合标准的代码!(因为浏览器在过去或将来可能会有所不同或根本不这样做.) (6认同)
xhtml1指定`<!ELEMENT html(head,body)>`[1] - 和html401指定`<!ELEMENT HTML OO(%html.content;)`with`<!ENTITY%html.content"HEAD,BODY"> `以及[2].html51表示`一个head元素后跟一个body元素.对于html内容.[3] http://www.w3.org/TR/xhtml1/dtds.html#a_dtd_XHTML-1.0-Strict http://www.w3.org/TR/xhtml1/dtds.html#a_dtd_XHTML-1.0-Strict http ://www.w3.org/TR/html51/semantics.html#the-html-element - 所以我猜所有常见/使用中的HTML标准*都需要一个body标签.:) (5认同)
@Kissaki:标准HTML根本不需要正文标签! (4认同)

Answer 4

Mar*_*iek 10

一般来说,我更喜欢不使用<body onload="">事件.我认为尽可能地将行为与内容分开是更清晰的.

也就是说,有时候(对我来说通常很少见)使用body onload可以提高速度.

我喜欢使用Prototype所以我通常会在<head我的页面中添加这样的内容:

document.observe("dom:loaded", function(){
  alert('The DOM is loaded!');
});

Run Code Online (Sandbox Code Playgroud)

要么

Event.observe(window, 'load', function(){
  alert('Window onload');
});

Run Code Online (Sandbox Code Playgroud)

以上是我在这里学到的技巧.我非常喜欢在HTML之外附加事件处理程序的概念.

(编辑以纠正代码中的拼写错误.)

Answer 5

小智 6

'对客观问题的这么多主观答案."不引人注目"的JavaScript迷信就像从未使用过旧规则一样.以有助于您可靠地实现目标的方式编写代码,而不是根据某人的时髦宗教信仰.

找到的人:

 <body onload="body_onload();">

Run Code Online (Sandbox Code Playgroud)

过分分散注意力是过于自命不凡,并没有优先考虑.

我通常将我的JavaScript代码放在一个单独的.js文件中,但我发现在HTML中挂钩事件处理程序并不麻烦,顺便说一句,HTML是有效的HTML.

编写不引人注目的javascript是有充分理由的.假设您有一个包含100页的Web应用程序并使用<body onload ="body_onload();">方法,而不是将其放在每个页面包含的javascript文件中.然后想象您需要因某种原因更改该功能的名称.将事件放在包含的javascript文件中1)使更改变得更加简单,并且2)节省了服务器资源,因为javascript文件可以缓存一年(在正确配置的服务器上),而不是一遍又一遍地下载相同的代码. (39认同)
所以,因为你不打扰学习为什么推荐你的东西,你就建议"时髦的宗教信仰"？ (21认同)
问题是"这两种方法之间有什么区别？",以及建议更好的请求.您的回复如何回答这个问题？ (6认同)

Answer 6

小智 5

window.onload- 在所有 DOM、JS 文件、图像、Iframe、扩展和其他文件完全加载后调用。这等于$(window).load(function() {})；

<body onload="">- DOM 加载后调用。这等于$(document).ready(function() {})；

这个答案与其他答案相矛盾；你能提供一个来源吗？ (2认同)
http://api.jquery.com/ready/ jQuery 文档说：“.ready() 方法通常与 <body onload=""> 属性不兼容。” 我认为 jQuery 更接近 body.onload $(window).load(..) 但我认为它们仍然不同。 (2认同)
这个答案是完全错误的，不应该有任何赞成票。事实上，这种类型的答案通常被认为是关于“ready”与“onload”事件的最大误解之一。`load` 在整个文档加载后触发，包括所有脚本、图像和样式表。`DOMContentLoaded` 在 DOM 树构建之后但在图像等之前触发。它的 `DOMContentLoaded` 相当于 `document.ready`，而不是 `load`。 (2认同)

归档时间：	17 年，2 月前
查看次数：	426951 次
最近记录：	8 年，6 月前