将js代码写在不同位置的区别

例1:
[code]<html xmlns="http://www.w3.org/1999/xhtml">;
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>例1</title>
</head>
<body>
<h1>
<script type="text/javascript">
document.write("Hello world !");
</script>
</h1>
</body>
</html>[/code]
例2:
[code]<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>例2</title>
<script>
function pageLoad(){
document.getElementsByTagName("h1")[0].innerHTML = "Hello World !";
}
</script>
</head>
<body onload="pageLoad()">
<h1> </h1>
</body>
</html>[/code]
例三:
[code]<html xmlns="http://www.w3.org/1999/xhtml">;
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>例3</title>
</head>
<body>
<script>
function pageLoad(){
document.getElementsByTagName("h1")[0].innerHTML = "Hello World !";
}
</script>
<h1> </h1>
</body>
</html>[/code]
[color=DeepSkyBlue] 我们将客户端声明周期划分为:初始化阶段和运行阶段。
初始化阶段:从页面数据被装载到页面数据被装载完毕。
运行阶段:从页面数据装载完毕一直到新的请求被发起之前。
与例1比较,例2是一种更加安全的方式,在这种方式中,指令不会对装在期的文档内容产生影响,脚本指令被注册到body的onload事件中执行,这样确保了在执行前所有的文档元素都已经正确初始化完毕。[/color][color=Red](假如出现某种意外导致程序终止,例1可能因此而导致文档数据不能加载完全,而例2则不会有这样的风险)[/color]
[color=DeepSkyBlue] 对于例三这种情况,则会产生脚本异常,原因是当document.getElementsByTagName("h1")被执行时,页面文档的h1标签还未被加载,因此document.getElementsByTagName("h1")返回一个空值null,结果引发了异常。[/color]

评论 ( 0 )
最新评论
暂无评论

赶紧努力消灭 0 回复