js <script>元素应该放在html页面的哪个位置？ - 码上快乐

相关内容简体繁体

`<script>` 的解析顺序的说明：

浏览器会按照 <script> 元素在页面中出现的先后顺序，对它们依次进行解析

`<script>` 存放位置的说明:

传统做法，<script> 元素都应该放在页面的 <head> 元素中。（这种做法的目的是把所有的外部文件引用都放在一起，例如 CSS文件和Javascript文件）
但是，放在 <head> 元素中，就意味着必须等到全部的javascript代码都被下载、解析和执行完成以后，才能开始呈现页面内容。（因为浏览器在遇到 <body> 标签时才开始呈现内容）
因此，放在 <head> 元素中，容易出现较长时间的空白页面（因为呈现被阻塞，如果javascript代码需要很多的话）
所以，最终 <script> 元素一般都放在 <body> 标签中页面内容的后面（也就是 </body> 标签的前面）

==================================

`<script>` 几个记录：

所有 <script> 元素都会按照它们在页面中出现的先后顺序依次被解析。（在不使用 defer 和 async 属性的情况下）
defer 属性，表示延迟解析脚本，即让脚本在文档完全呈现后再执行。（延迟脚本总是按照指定它们的顺序执行）
async 属性，表示异步解析脚本，即表示当前脚本不必等待其他脚本，也不必阻挡文档呈现。（区别于 defer，异步脚本不能按照在页面中的出现的顺序执行）

    <script defer="defer" src="...外部脚本路径"></script>   
    <script async="async" src="...外部脚本路径"></script>

免责声明！

本站转载的文章为个人学习借鉴使用，本站对版权不负任何法律责任。如果侵犯了您的隐私权益，请联系本站邮箱yoyou2525@163.com删除。

猜您在找 【web性能】js应该放在html页面的什么位置函数直接写在html页面的