22

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

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

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

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

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

5 回答 5

18

以下 HTML 标记支持“onload”：

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

以及以下 Javascript 对象：

image, layer, window

于 2009-03-24T23:45:20.750 回答
9

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

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?

为了获得最大的覆盖率，最好考虑到所有引用 url 的 html 元素都会产生一个请求，并在该请求成功或失败时触发一个loador事件。error所以，基本上，任何具有srcorhref属性的元素，除了这些标签：

a
# What else? Not sure off hand..

并且包括body标签，因为具有讽刺意味的是它没有srcORhref属性。

下面是一些用于发现这些元素的粗略 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 属性的标签，但并非总是如此。

其他可能导致网络故障的事情：

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

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

于 2013-09-30T11:19:01.790 回答
2

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

于 2009-03-24T23:43:58.493 回答
1

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

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

于 2009-03-24T23:46:11.047 回答
0

根据this page，您可以使用onload：<body>、<frame>、<frameset>、<iframe>、<img>、<link>和<script>。

于 2009-03-24T23:44:03.173 回答