Script 元素

• 直接在页面中嵌入 JavaScript 代码

<script type="text/javascript">
    function sayHi(){
        alert('Hi')
    }
</script>

• 包含外部 JavaScript 文件

<script type="text/javascript" src="./example.js"></script>

Script 属性 async、defer 的区别

先来看一张图

284aec5bb7f16b3ef4e7482110c5ddbb_articlex.jpeg

async 和 defer 相同的地方

defer 和 async 在加载的时候都是异步加载，不影响加载其他资源和其他脚本。

defer

让脚本在文档完全呈现之后执行。延迟脚本总是按照加载顺序执行脚本。

async

异步脚本不必等待其他脚本，也不必阻塞文档呈现，反正对它来说脚本的加载和执行是紧紧挨着的，所以不管你声明的顺序如何，只要它加载完了就会立刻执行。脚本的执行顺序是乱序的。

文档模式

• 混杂模式（quirks mode）
• 标准模式（standards mode）
• 准标准模式。

文档模式：HTML 文档模式是通过使用文档类型 DOCTYPE 来指定的。DOCTYPE 中会引用对应的 dtd 文件，这个文件告诉浏览器按什么标准、规则来解析文件。html5 标准不依赖于 SGML 规则，所以不需要引用 dtd 文件。