js的位置放置

由于是菜鸟 只会写些简单的js  以前都是放在head里面 然后在body中某个地方调用它     
这个几天刚好有时间  想深入学一下  发现传智播客上面讲的放在body下面  然后在网上查了下 说也可以放在body里面   自己也试了下   放在三个位置 有的可以实现  有的放了不起作用 就是问一句 放在head里面、body里面和body下面的区别    谢过

解决方案 »

  1.   

    js 三种位置的区别：
    head :
       -- 在调用脚本时，已经完成加载了
       --
    body ：
       -- 在生成页面的时候就已经完成加载了
       --
    外部js ：
       -- 引用外部js 注意：外部js不能包含<script></script>这两个标签
       -- 主要是为了节省当多个页面重复调用相同js函数时，可以节省在每个页面中嵌入相同的js代码；浏览器不识别 js 解决办法 ：<!--
                                 代码部分
                                //-->
      

  2.   

    JS代码放在head和body中的区别分析放在head中的JS代码会在页面加载完成之前就读取，而放在body中的JS代码，会在整个页面加载完成之后读取
    那么有什么不同呢？先看一个例子：
    一个二级级联动态下拉列表框，一级分类（即大类别）id="vSort0".
    复制代码 代码如下:<head>
    function changelocation(id)
    {…………}
    </head>
    <body><select class="input1" id="vSort0" name="vSort0" onChange="changelocation(document.form4.vSort0.options[document.form4.vSort0.selectedIndex].value);" style="width:100px;">……省略……</select>
    ………………
    </body>现在有个js脚本：
    复制代码 代码如下:<script LANGUAGE= "JavaScript" >
    changelocation(document.form4.vSort0.options[document.form4.vSort0.selectedIndex].value); //初始化第一个一级分类的二级分类，去掉后第一个一级分类的二级分类在页面载入之后不显示。回选才显示。将一级分类的value传给changelocation()函数,生成二级分类的列表
    </script>那么把这个js脚本放head里面还是body里面呢？
    答案是不仅要放到body里面，而且还得放到定义id='vSort0'的列表框后面，因为这个js脚本中有document.form4.vSort0.selectedIndex，如果放到head里或者body的id='vSort0'前，页面加载后顺序执行代码，执行到这个js发现vSort0未定义（即undefind），这个js也就失去了作用。
    而为什么我们经常看到有很多的人把js脚本放到head里面没事呢？对！
    就是因为你看到的在head里的js代码有onclick等事件传递了变量给函数。
    这就告诉我们，如果我们想定义一个全局对象，而这个对象与页面中的某个按钮（等等）有关时， 我们必须将其放入body中，道理很明显：如果放入head，那当页面加载head部分的时候，那个按钮（等等）都还没有被定义（也可以说是还没有被加 载，因为加载的过程就是执行代码的过程，包括了定义），你能得到的只可能是一个undefind。