首页 > 代码库 > JavaScript DOM_2 JS编写位置

JavaScript DOM_2 JS编写位置

JS代码编写位置:


    1.编写在head节点中。如下代码所示:

<head>
    <script type="text/javascript">
        window,load=function(){
            alert("加载完成");
        }
    </script>
</head>


    2.编写在html标签内。

<body>
    <button onclick="alert(‘Hello World!‘)">ClickMe</button>
</body>

    说明:这样不适合编写JS代码,因为HTML代码和JSd代码耦合了,如果JS代码量比较大的时候不应该采用这种方式,不利于管理代码,同时也不方便编写。代码量小的时候这种方式可以很轻松的去编写实现效果和功能,所以要根绝项目大小和代码量多少,合理的选取该种方式,不过建议不要使用这种方式,不利于后期扩展。


    3.编写在HTML节点之外

<HTML>
    <HEAD>
        <TITLE>JavaScript</TITLE>
    </HEAD>
    <BODY>
    </BODY>
</HTML>
<SCRIPT type="text/javascript">
    window.load = function(){
        alert("加载完毕!");
    }
</SCRIPT>


    4.编写在单独的文件中在使用的地方引入

   
   var btn = document.getElementsByTagName("button")[0];
   btn.onclick = function(){
     alert("大家好!");  
   }

    该种方法是推荐使用的,因为解耦了HTML和JavaScript代码,同时利于后期的维护和扩展,是很多程序员都使用的方法。


总结:

    具体使用哪种或者哪几种混合使用,都是根据项目需要来定,但一切的目的都是为了,减少前期和后期维护的代价,所以没有一定要如何使用的约束,但第四种最为通用。

本文出自 “爱咖啡” 博客,请务必保留此出处http://4837471.blog.51cto.com/4827471/1569082

JavaScript DOM_2 JS编写位置