1、JScript放置的位置

1、html文件是自上而下的执行方式,但引入的css和javascript的顺序有所不同,css引入执行加载时,程序仍然往下执行,而执行到<script>脚本是则中断线程,待该script脚本执行结束之后程序才继续往下执行。

  所以,大部分网上讨论是将script脚本放在<body>之后,那样dom的生成就不会因为长时间执行script脚本而延迟阻塞,加快了页面的加载速度。但又不能将所有的script放在body之后,因为有一些页面的效果的实现,是需要预先动态的加载一些js脚本。所以这些脚本应该放在<body>之前。

  其次,不能将需要访问dom元素的js放在body之前,因为此时还没有开始生成dom,所以在body之前的访问dom元素的js会出错,或者无效。

  script放置位置的原则事页面效果实现类的js应该放在body之前,动作,交互,事件驱动,需要访问dom属性的js都可以放在body之后

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8"/>
    <title>Example</title>
    
    <script>
        JavaScript goes here...
    </script>
<head>
<body>
    Mark-up goes here...
</body>
</html>

2、将JavaScript代码存为一个扩展名为.js的独立文件

  典型做法是在文档的<head>部分放一个<script>标签,并把它的src属性指向该文件。

  但最好的做法是把<script>标签放到HTML文档的最后,</body>标签之前。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8"/>
    <title>Example</title>
    
    <script src="file.js"></script>
<head>
<body>
    Mark-up goes here...
</body>
</html><!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8"/>
    <title>Example</title>
<head>
<body>
  Mark-up goes here...   <script src="file.js"></script> </body> </html>
原文地址:https://www.cnblogs.com/huangj/p/7095117.html