Quelles balises html supportent les attributs d'événement javascript onload/onerror?

je suis familier avec l'utilisation typique de onload, comme dans l'exemple suivant:

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

Quels sont tous les éléments html qui déclenchent un événement de charge? (exécutant ainsi javascript fourni dans un attribut onload)

Par exemple, img est l'une de ces balises qui exécutera le javascript fourni dans un onload l'attribut lors de l' some.png a chargé:

<img onload="someImgLoaded()" src="some.png" />
21
demandé sur Devin G Rhode 2009-03-25 02:42:15

5 réponses

'onload' est supporté par les balises HTML suivantes:

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

et les objets Javascript suivants:

image, layer, window

16
répondu Brian R. Bondy 2014-12-27 05:39:50

ci-dessous se trouve une liste beaucoup plus complète des éléments qui déclenchent un événement load lorsque la ressource demandée termine le téléchargement:

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?

pour la plus grande couverture, il est préférable de considérer que tous les éléments html référencant une url résulteront en une requête et lanceront un load ou error événement lors de la demande de la réussite ou de l'échec. Donc, en gros, tout élément avec un src ou href l'attribut, à l'exception de ces balises:

a
# What else? Not sure off hand..

Et y compris le body balise, parce que c'est une ironie n'a pas un src OR href l'attribut.

ci-dessous est un javascript approximatif pour découvrir ces éléments:

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:');

aussi, avec la méthode "everything with src ou href", vous ignorez les balises non pertinentes ou autres qui ont typiquement un attribut src ou href, mais pas toujours.

d'Autres choses qui peuvent avoir des pannes de réseau:

onload et onerror les attributs peuvent être utiles pour savoir si votre Utilisateur a ou non une connexion Internet active, ce que j'essaie d'aborder avec ma bibliothèque check-online.js: http://github.com/devinrhode2/check-online

il y a des tests évidents à faire pour voir si oui ou non

6
répondu Devin G Rhode 2013-09-30 11:24:51

onload est un événement spécifique à l' body,frame, iframe,img,link et script éléments. Essentiellement tout ce qui représente une ressource à charger. body, c'est le document en question. Pour les autres, chacun est assez évident.

2
répondu Rex M 2012-09-05 20:33:07

de nombreux éléments ont l'événement onload. Vous pouvez les trouver ici

Mais si vous voulez tester le chargement du DOM, alors il est préférable d'utiliser le la fenêtre.onload. Il est également recommandé de séparer le code javascript du balisage HTML.

1
répondu andi 2015-09-09 16:47:43

Selon cette page, vous pouvez utiliser onload avec: <body>,<frame>, <frameset>,<iframe>,<img>,<link> et <script>.

0
répondu Daniel Lew 2012-09-05 20:35:12