Developing interactivity in your website pages will require you, to build a portion of it with javascript. If that javascript needs to perform its actions when the DOM has finished loading, you have several options depending on if you are using a javascript library or not. If you’re going the non-library route, you can do the following:

1
2
3
   window.onload = function() {
      // do something now that the dom is loaded
   }

The caveat here, is that based on what gets loaded first, you’ll have to ensure that you take into account any other code that needs to be post-DOM loaded. I would suggest using a library regardless, they make life oh so much more simple.

First example is using mootools:

1
2
3
   window.addEvent('domready', function() {
        // do something now that the dom is loaded
   }

Here’s an example using jquery:

1
2
3
   $(document).ready(function() {
      // do something now that the dom is loaded
   }

And finally here’s an example using prototype:

1
2
3
   document.observe("dom:loaded", function() {
      // do something now that the dom is loaded
   }

So go forth, and remember the proper order of operations. No inlining your javascript folks!