Javascript – How to detect when a web page is loaded

htmljavascript

I want to write an application that detects when a page is loaded in the browser, then I should be able to insert content on top of the loaded web page? Anybody with an idea on how to do that?

Please note that I should be able to do this in any browser (Firefox/IE).

What language should I use to help me do this?

How do I detect this from an external application?

How should I integrate this with the browser?

Best Solution

You would use javascript to do this. If you don't know how to use javascript, I would recommend reading through some tutorials first.

After you have a basic understanding of javascript, you can detect when a page has loaded by using the window.onload event.

window.onload = function() {
  addPageContents();  //example function call.
}

Edit: If you want to add more than one onload function, and not use a javascript library, you can wrap your own onload hanlder.

window.whenloaded = function(fn) {
  if (window.onload) {
    var old = window.onload;
    window.onload = function() {
      old();
      fn();
    }
  } else {
    window.onload = fn;
  }
}