2009-03-24 9 views
21

estoy familiarizado con el uso típico de onload, como en el siguiente:¿Qué etiquetas html admiten los atributos de evento javascript onload/onerror?

<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" /> 

Respuesta

16

'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

+0

¿Qué pasa con las etiquetas no, como un documento DOM o una ventana? (No estoy seguro, pero creo que también tienen carga). – strager

+0

Guau, esa actualización fue rápida. ; P +1 – strager

+0

Gracias. Ustedes me hacen parecer flojo. :) –

2

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

0

Según this page, puede utilizar onload con: <body>, <frame>, <frameset>, , <img>, <link> y <script>.

1

muchos elementos h ave el evento de carga. Puede encontrarlos here

Pero si quiere probar la carga del DOM, entonces es mejor usar el window.onload. También se recomienda que separe el código javascript del marcado HTML.

6

A continuación se presenta 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 resultarán en una solicitud y desencadena un evento load o error cuando la solicitud para el éxito o falla. 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 mantener un registro de si su usuario tiene una conexión a Internet activa, que es algo que estoy tratando de abordar con mi biblioteca check-online.js: http://github.com/devinrhode2/check-online

Hay algunas pruebas obvias para ser hecho para ver si

Cuestiones relacionadas