script在html中的摆放位置

hxy 2020-02-22 AM 191℃ 0条 访问: 192 次

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

eg:错的

 <script>
    var a, b, x;
    a = 1;
    b = 2;
    x = a + b;
    document.getElementById("demo").innerHTML = x;
  </script>
<p id="demo"></p>

eg:对的

<p id="demo"></p>
  <script>
    var a, b, x;
    a = 1;
    b = 2;
    x = a + b;
    document.getElementById("demo").innerHTML = x;
  </script>

这是因为html文件是自上而下的执行方式,但引入的css和javascript的顺序有所不同,css引入执行加载时,程序仍然往下执行,而执行到<script>脚本是则中断线程,待该script脚本执行结束之后程序才继续往下执行。所以,一般将script放在body之后是因为避免长时间执行script脚本而延迟阻塞。而有一些页面的效果的实现,是需要预先动态的加载一些js脚本,所以这些脚本应该放在<body>之前。

ps:其实还有另外一种方法,那就是用jquery的初始化页面方法,把上面给标签添加的点击事件加入到$(function(){})中也是可以的,原理和上面是一样的,这个方法是等页面加载好了才执行,所以不管放在哪都可以了!

标签: none

非特殊说明,本博所有文章均为博主原创。

评论啦~