这篇笔记的内容对应的是《JavaScript高级程序设计(第三版)》中的第二章。

1.使用方式

在HTML中使用 JavaScript 的方式有两种,第一种就是直接内部使用;第二种就是外部引入。

1-1 HTML文件内部使用

<script type="text/javascript">
  // 使用到的 JavaScript 代码
</script>

1-2 引入外部js文件

<script type="text/javascript" src="外部js代码的地址"></script>

2.标签的位置

一般情况下,标签的位置放在 head 标签中:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <!-- 引入js代码 -->
    <script type="text/javascript" src="a.js"></script>
</head>
<body>
    <!-- 页面结构 -->
</body>
</html>

对于需要引入很多js的html中间,如果把js放在头部,无疑会导致浏览器呈现页面出现延迟,就是导致页面出现空白。这样的用户体验肯定不好,因此,可以将js放在所有的页面结构代码之后。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <!-- 页面结构 -->
    <!-- 引入js代码 -->
    <script type="text/javascript" src="a.js"></script>
</body>
</html>

沫俱宏
763 声望33 粉丝

自己的肯定最重要,做任何决定,一定要从内心出发