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" />
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
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:
- Application Cache
- XMLHttpRequest
- WebSocket
- PeerConnection (WebRTC)
- à partir de: http://docs.webplatform.org/w/index.php?search=onerror&fulltext=+&title=Special%3ASearch
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
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.
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.
Selon cette page, vous pouvez utiliser onload
avec: <body>
,<frame>
, <frameset>
,<iframe>
,<img>
,<link>
et <script>
.