What html tags support the onload/onerror javascript event attributes?

'onload' is supported by the following HTML tags:

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

And the following Javascript objects:

image, layer, window

Below is a much more comprehensive list of elements that fire a load event when the requested resource finishes downloading:

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?

For the most coverage, it's best to consider that all html elements referencing a url will result in a request and fire a load or error event when that request for the succeeds or fails. So, basically, any element with a src or href attribute, except for these tags:

a
# What else? Not sure off hand..

And including the body tag, because it ironically doesn't have a src OR href attribute.

Below is some rough javascript for discovering these elements:

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

Also, with the "everything with src or href" method, you ignore irrelevant or other tags that typically have a src or href attribute, but not always.

Other things that can have network failures:

Application Cache
XMLHttpRequest
WebSocket
PeerConnection (WebRTC)
From: http://docs.webplatform.org/w/index.php?search=onerror&fulltext=+&title=Special%3ASearch

onload and onerror attributes can be useful to keeping track of whether or not your user has an active internet connection, which is something I'm attempting to address with my library check-online.js: http://github.com/devinrhode2/check-online

There is some obvious testing to be done to see whether or not

onload is an event specific to the body, frame, iframe, img, link, and script elements. Basically anything which represents a resource to be loaded. For body, that is the document in question. For the others, each is fairly obvious.

Many elements have the onload event. You can find them here

But if you want to test the loading of the DOM, then it's best to use the window.onload. It's also recommended that you separate the javascript code from the HTML markup.

What html tags support the onload/onerror javascript event attributes?

Related

Recent Posts