window.onload事件可以安全的执行javascript，因为该事件是在页面完全加载完后才开始执行（包括页面内的图片、flash等所有元素），不会因为JS需要对某个DOM 操作，而页面还没有加载该节点而引起错误。但是这种安全是需要付出代价的：如果某些图片（或者一些别的东西）加载特别慢，那么load事件会等到很久之后才会触发。针对这个问题，一些JS框架提供了一些补充方法。如：jquery的$(document).ready()、mootools的domready事件。都是在页面的DOM加载完毕后立即执行，而不需要等待漫长的图片下载过程。如果不使用这些框架，可以使用这个独立的DomReady.js

(function(){ 
 
    var DomReady = window.DomReady = {}; 
 
    // Everything that has to do with properly supporting our document ready event. Brought over from the most awesome jQuery.  
 
    var userAgent = navigator.userAgent.toLowerCase(); 
 
    // Figure out what browser is being used 
    var browser = { 
        version: (userAgent.match( /.+(?:rv|it|ra|ie)[\/: ]([\d.]+)/ ) || [])[1], 
        safari: /webkit/.test(userAgent), 
        opera: /opera/.test(userAgent), 
        msie: (/msie/.test(userAgent)) && (!/opera/.test( userAgent )), 
        mozilla: (/mozilla/.test(userAgent)) && (!/(compatible|webkit)/.test(userAgent)) 
    };     
 
    var readyBound = false;  
    var isReady = false; 
    var readyList = []; 
 
    // Handle when the DOM is ready 
    function domReady() { 
        // Make sure that the DOM is not already loaded 
        if(!isReady) { 
            // Remember that the DOM is ready 
            isReady = true; 
         
            if(readyList) { 
                for(var fn = 0; fn < readyList.length; fn++) { 
                    readyList[fn].call(window, []); 
                } 
             
                readyList = []; 
            } 
        } 
    }; 
 
    // From Simon Willison. A safe way to fire onload w/o screwing up everyone else. 
    function addLoadEvent(func) { 
      var oldonload = window.onload; 
      if (typeof window.onload != 'function') { 
        window.onload = func; 
      } else { 
        window.onload = function() { 
          if (oldonload) { 
            oldonload(); 
          } 
          func(); 
        } 
      } 
    }; 
 
    // does the heavy work of working through the browsers idiosyncracies (let's call them that) to hook onload. 
    function bindReady() { 
        if(readyBound) { 
            return; 
        } 
     
        readyBound = true; 
 
        // Mozilla, Opera (see further below for it) and webkit nightlies currently support this event 
        if (document.addEventListener && !browser.opera) { 
            // Use the handy event callback 
            document.addEventListener("DOMContentLoaded", domReady, false); 
        } 
 
        // If IE is used and is not in a frame 
        // Continually check to see if the document is ready 
        if (browser.msie && window == top) (function(){ 
            if (isReady) return; 
            try { 
                // If IE is used, use the trick by Diego Perini 
                // http://javascript.nwbox.com/IEContentLoaded/ 
                document.documentElement.doScroll("left"); 
            } catch(error) { 
                setTimeout(arguments.callee, 0); 
                return; 
            } 
            // and execute any waiting functions 
            domReady(); 
        })(); 
 
        if(browser.opera) { 
            document.addEventListener( "DOMContentLoaded", function () { 
                if (isReady) return; 
                for (var i = 0; i < document.styleSheets.length; i++) 
                    if (document.styleSheets[i].disabled) { 
                        setTimeout( arguments.callee, 0 ); 
                        return; 
                    } 
                // and execute any waiting functions 
                domReady(); 
            }, false); 
        } 
 
        if(browser.safari) { 
            var numStyles; 
            (function(){ 
                if (isReady) return; 
                if (document.readyState != "loaded" && document.readyState != "complete") { 
                    setTimeout( arguments.callee, 0 ); 
                    return; 
                } 
                if (numStyles === undefined) { 
                    var links = document.getElementsByTagName("link"); 
                    for (var i=0; i < links.length; i++) { 
                        if(links[i].getAttribute('rel') == 'stylesheet') { 
                            numStyles++; 
                        } 
                    } 
                    var styles = document.getElementsByTagName("style"); 
                    numStyles += styles.length; 
                } 
                if (document.styleSheets.length != numStyles) { 
                    setTimeout( arguments.callee, 0 ); 
                    return; 
                } 
             
                // and execute any waiting functions 
                domReady(); 
            })(); 
        } 
 
        // A fallback to window.onload, that will always work 
        addLoadEvent(domReady); 
    }; 
 
    // This is the public function that people can use to hook up ready. 
    DomReady.ready = function(fn, args) { 
        // Attach the listeners 
        bindReady(); 
     
        // If the DOM is already ready 
        if (isReady) { 
            // Execute the function immediately 
            fn.call(window, []); 
        } else { 
            // Add the function to the wait list 
            readyList.push( function() { return fn.call(window, []); } ); 
        } 
    }; 
     
    bindReady(); 
     
})(); 

使用方法：

<html lang="en"> 
<head> 
    <script src="domready.js" type="application/javascript"></script> 
    <script type="application/javascript"> 
        DomReady.ready(function() { 
            alert('dom is ready'); 
        }); 
    </script> 
</head> 
<body> 
 
</body> 
</html>