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 文件都集中放在一起,缺点就是,必须把所有的 </head> 标签之前的 JavaScript 文件都下载、解析和解释执行完成后,才能开始渲染 <body> 标签后的页面内容。对于需要很多 JavaScript 的页面,这会导致页面渲染明显延迟,在此期间浏览器窗口完全空白。为了解决此问题,可将所有或者部分 <script> 元素放在结束标签 </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/javascripte/2217.html

(0)
上一篇 2020年10月7日 18:39
下一篇 2020年11月1日 23:08

相关推荐

  • Node.js代码的三种运行方式

    1.node -p或-e命令式 2.node script.js文件式 helloworld.js文件代码清单: 启动终端,使用 cd 命令,切换到存放 helloworld.js 文件的目录。执行以下命令: 3.node -i交互式

    JavaScript经验 2023年2月23日
    0640
  • nodejs -v与node -v的区别

    笔者在使用Node.js的时候发现有nodejs -v和node -v两个命令,经过一番测试后,总结如下: 如果从Ubuntu操作系统官方源里面安装的Node.js,命令用nodejs -v,例如: 如果从Ubuntu操作系统以外的第三方源(包括snap)安装的Node.js,命令用node -v,例如:

    JavaScript经验 2020年9月12日
    03.5K0
  • JavaScript语言的CommonJS模块规范详解

    CommonJS模块规范用于在服务器端实现模块化组织代码,而Node.js使用了CommonJS模块规范的轻微修改版本,本文介绍Node.js风格的模块定义方式。 每个文件本身都是模块,在文件中定义的类、变量、常量和函数对这个文件而言都是私有(private)的,除非它们被显式导出。另外,一个模块导出的值只有在显式导入…

    JavaScript经验 2023年3月7日
    0450

发表回复

登录后才能评论