¿Qué etiquetas HTML apoyar el proceso de carga / onerror atributos de eventos de JavaScript?

StackOverflow https://stackoverflow.com/questions/679704

Pregunta

Estoy familiarizado con el uso típico de onload, como en el siguiente:

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

¿Cuáles son todos los elementos HTML que disparan un evento de carga? (Ejecución así javascript suministrado en un atributo onload)

Por ejemplo, img es uno de tales etiqueta que ejecutará el javascript suministrado en un atributo onload cuando some.png ha cargado:

<img onload="someImgLoaded()" src="some.png" />
¿Fue útil?

Solución

'proceso de carga' con el apoyo de las siguientes etiquetas HTML:

  

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

Y los siguientes objetos de Javascript:

  

image, layer, window

Otros consejos

A continuación se muestra una lista mucho más amplia de elementos que disparan un evento de carga cuando el recurso solicitado termine la descarga:

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?

En su mayor cobertura, lo mejor es tener en cuenta que todos los elementos HTML que hacen referencia a una URL se traducirá en una petición y disparar un evento load o error cuando esa solicitud para el éxito o fracasa. Así que, básicamente, cualquier elemento con un atributo src o href, a excepción de las siguientes etiquetas:

a
# What else? Not sure off hand..

Y incluyendo la etiqueta body, ya que irónicamente no tiene un atributo src O href.

A continuación se muestra algunos javascript en bruto para el descubrimiento de estos elementos:

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

Además, con el "todo con href src o" método, se ignoran las etiquetas irrelevantes o de otro tipo que normalmente tienen un src o atributo href, pero no siempre.

Otras cosas que pueden tener fallos en la red:

onload y onerror atributos pueden ser útiles para hacer el seguimiento de si su usuario tiene una conexión activa a Internet, lo cual es algo que estoy tratando de hacer frente a la biblioteca con mis chequeos online.js: http://github.com/devinrhode2/check-online

Hay algunas pruebas evidentes que se realiza para ver si es o no

onload es un evento específico a los elementos body, frame, iframe, img, link, y script. Básicamente cualquier cosa que representa un recurso para ser cargado. Para body, que es el documento en cuestión. Para los demás, cada uno es bastante obvio.

Muchos elementos tienen el proceso de carga. Los puede encontrar aquí

Pero si desea probar la carga del DOM, entonces lo mejor es utilizar el window.onload . También se recomienda separar el código JavaScript del marcado HTML.

De acuerdo con esta página , se puede utilizar con onload: <body>, <frame>, <frameset>, <iframe>, <img>, <link> y <script>.

Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top