<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>弹出窗口</title> </head> <body> <a href="http://www.example.com/" class="popup">弹出窗口</a> <script type="text/javascript"> window.onload=prepareLinks; function prepareLinks(){ var links=document.getElementsByTagName('a'); for(var i=0;i<links.length;i++){ if(links[i].className=="popup"){ //links[i].getAttribute('class') 貌似ie6不支持 links[i].onclick=function(){ popup(this.href); return false; } } } } function popup(whichUrl){ window.open(whichUrl,'popup','width=360,height=480'); } </script> </body> </html>
讲解：
var links=document.getElementsByTagName('a');
这条语句将在javascript文件被加载时立刻执行。如果javascript文件是从HTML文档的<head>部分用<script>标签调用的，它将在html文档之前加载到浏览器里。同样，如果<script>标签位于文档底部</body>之前，就不能保证哪个文件最先结束加载。（浏览器可能一次加载多个）。因为脚本加载时文档可能不完整，所以模型也不完整。没有完整的Dom,getElementsByTagName等方法就不能正常工作。
必须让这些代码在Html文档全部加载到浏览器之后马上开始执行。还好，html文档全部加载完毕时会触发一个时间。
文档被加载到一个浏览器窗口里，document对象又是window对象的一个属性。当window对象触发onload事件时，document对象已经存在。
window.onload=function(){}