JavaScript中script元素的位置

所有<script>都放在<head>标签内,如下所示:

<!DOCTYPE html>
<html>
  <head>
  <title>Example HTML Page</title>
  <script src="example1.js"></script>
  <script src="example2.js"></script>
  </head>
  <body>
  <!-- 这里是页面内容 -->
  </body>
</html>

这样做的目的是把外部的 CSS 和 JavaScript 文件都集中放在一起,缺点就是,必须把所有的 JavaScript 的文件都下载、解析和解释执行完成后,才能渲染页面,这会导致页面渲染明显延时,为了解决此问题,可将所有或者部分 JavaScript <script>放在<body>元素中的页面内容后面,也就是</body>之前,如下所示:

<!DOCTYPE html>
<html>
  <head>
  <title>Example HTML Page</title>
  </head>
  <body>
  <!-- 这里是页面内容 -->
  <script src="example1.js"></script>
  <script src="example2.js"></script>
  </body>
</html>

原创文章,作者:huoxiaoqiang,如若转载,请注明出处:https://www.huoxiaoqiang.com/experience/jsops/2217.html

发表评论

电子邮件地址不会被公开。 必填项已用*标注