<html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> <script type="text/javascript" src="jquery2.js"></script> <script language="javascript"> window.onload = haha(); function haha(){console.log(document.getElementById("div1"));} </script> </head> <body> <div id="div1">a</div> </body> </html>
执行结果是null。window.onload = haha(); 这样写是错误的，不需要加括号，引用不用加括号，加了括号就成了函数返回值了，在页面还没加载完就执行了，当然是null。window.onload = haha; 这样才是正确的写法。
<html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> <script type="text/javascript" src="jquery2.js"></script> <script language="javascript"> window.onload = haha; function haha(){console.log(document.getElementById("div1"));} if(document.addEventListener){ function DOMContentLoaded(){ console.log("DOMContentLoaded"); } document.addEventListener( "DOMContentLoaded", DOMContentLoaded, false ); } </script> </head> <body> <div id="div1">a</div> </body> </html>
执行结果是：DOMContentLoaded然后才是<div id="div1">a</div>，一般情况下，DOMContentLoaded事件要在window.onload之前执行，当DOM树构建完成的时候就会执行DOMContentLoaded事件。当window.onload事件触发时，页面上所有的DOM，样式表，脚本，图片，flash都已经加载完成了。
如果你是个jQuery使用者，你可能会经常使用$(document).ready();或者$(function(){})
这都是使用了DOMContentLoaded事件
http://bbs.csdn.net/topics/340107576
原文：http://www.cnblogs.com/EricaMIN1987_IT/p/3705794.html