Question

我熟悉onload的典型用法，如下所示：

<body onload="alert('Hello, World!');">
...
</body>

触发加载事件的所有html元素是什么？（从而执行onload属性中提供的javascript）

例如，img就是一个这样的标记，它会在onload加载时执行some.png属性中提供的javascript：

<img onload="someImgLoaded()" src="some.png" />

Answer 1

以下HTML标记支持

'onload'：

<body>, <frame>, <frameset>, <iframe>, <img>, <link>, <script>

以下Javascript对象：

image, layer, window

Answer 2

以下是在请求的资源完成下载时触发加载事件的更全面的元素列表：

body # (just fires a load event, doesn't make requests itself)
img
image
link
iframe
frameset
frame
script
embed
object
video ?
  source
  track
audio ?
  source
svg
<input type="image" src="submit.gif" alt="Submit">
<object width="400" height="400" data="helloworld.swf"></object>
<map name="planetmap">
  <area shape="rect" coords="0,0,82,126" href="sun.htm" alt="Sun">
webgl?

对于大多数覆盖范围，最好考虑所有引用网址的html元素都会产生请求，并在该请求成功或失败时触发load或error事件。所以，基本上，任何具有src或href属性的元素，除了这些标记：

a
# What else? Not sure off hand..

并包含body标记，因为具有讽刺意味的是，它没有src OR href属性。

以下是一些用于发现这些元素的粗略javascript：

var tagsToIgnore = ['a'];

['src', 'href'].forEach(function(attr) {
  console.log('====' + attr + '====');
  [].slice.call(document.querySelectorAll('*[' + attr + ']')).forEach(function(el){
    if (!~tagsToIgnore.indexOf(el.tagName.toLowerCase())) {
      console.log(el.tagName);
    }
  });
});
console.log('body # :trollface:');

此外，使用“使用src或href的所有内容”方法，您可以忽略通常具有src或href属性的不相关或其他标记，但并非总是如此。

可能导致网络故障的其他因素：

应用程序缓存
的XMLHttpRequest
的WebSocket
PeerConnection（WebRTC）
来自：http://docs.webplatform.org/w/index.php?search=onerror&fulltext=+&title=Special%3ASearch

onload和onerror属性可用于跟踪您的用户是否具有有效的互联网连接，这是我试图通过我的库检查在线的问题。：http://github.com/devinrhode2/check-online

有一些明显的测试要做，看看是否

Answer 3

onload是特定于body，frame，iframe，img，link和script的事件元素。基本上任何代表要加载的资源的东西。对于body，这是相关文档。对于其他人来说，每个都很明显。

Answer 4

许多元素都有onload事件。你可以找到它们here

但是如果你想测试DOM的加载，那么最好使用window.onload。还建议您将javascript代码与HTML标记分开。

Answer 5

根据this page，您可以将onload与<body>，<frame>，<frameset>，<iframe>，<img>结合使用，<link>和<script>。

什么html标签支持onload / onerror javascript事件属性？

5 个答案: