JavaScript位置寄存
日期：2014-05-16 浏览次数：20347 次
[装]：http://blog.sina.com.cn/s/blog_66087e6f0100n30d.html
代码如下：
<html>
<head>
??? <title></title>
??? <style type="text/css">
??????? #p{
??????????? font-size:22px;
??????????? color:blue;
??????????? width:150px;
??????????? height:150px;
??????????? border:1px solid #000;
??????? }
??????? #c{
????????????? font-size:11px;
??????????? margin-left:20px;
??????????? margin-top:10px;
??????????? width:100px;
??????????? height:100px;
???????????? border:1px solid #000;
??????? }
??? </style>
??? <!--不能把 javascript放到这里-->
</head>
<script type="text/javascript">
??????? var p=document.getElementByIdx_x("p");
??????? var c=document.getElementByIdx_x("c");
??????? alert("按确定键观察父节点改变效果");
??????? with(p.style){
?????????? fontSize ="18px";
?????????? color="black";
?????????? background="red";
??????? }
???????? alert("按确定键观察子节点改变效果");
?????????? with(c.style){
??????????? fontSize ="22px";
??????????? background="LightGrey"
??????? }
??? </script>
<body>
??? <!--父节点-->
??? <div id="p">父节点
??????? <div id="c">子节点
??????? </div>
??? </div>
</body>
<!--javascript要放到body下面，或者body前面-->
?<script type="text/javascript">
??????? var p=document.getElementByIdx_x("p");
??????? var c=document.getElementByIdx_x("c");
??????? alert("按确定键观察父节点改变效果");
??????? with(p.style){
?????????? fontSize ="18px";
?????????? color="black";
?????????? background="red";
??????? }
???????? alert("按确定键观察子节点改变效果");
?????????? with(c.style){
??????????? fontSize ="22px";
??????????? background="LightGrey"
??????? }
??? </script>
</html>
?
JS位置存放：
对于JS在什么时候应该包含在head中，什么时候应当包含在body中，人们有着不同的看法。但下面的规则是适用的：
1. 当JavaScript要在页面加载过程中动态建立一些Web页面的内容时，应将JavaScript放在body中。
2. 定义为函数并用于页面事件的JavaScript应当放在head标记中，因为它会在body之前加载。
放置脚本的一个很好的经验规则是：仅当页面载入期间脚本会建立一些Web页面内容时，才将脚本嵌入在body中；否则，将其放在head元素中。采用这种方法，页面就不会被脚本搞得一团糟，在每个页面中，总可以在同一个位置找到脚本。
有种方法可以避免将JavaScript插入到body中，即使用DOM生成一个新内容，再将其附加给一个页面元素
