JS执行顺序
Posted 前端小小小小小小小白
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了JS执行顺序相关的知识,希望对你有一定的参考价值。
在 html 文档中的执行顺序
js代码执行顺序比较的形象,用户可以直观的感受这种执行顺序。但是,js代码的执行顺序是比较复杂的。有时候我们会把js代码写在html里面,而html文档在浏览器中解析的过程是这样:浏览器按照文档流从上到下逐步解析页面结构和信息。js代码作为嵌入的脚本也算做html文档的组成部分,因此,js代码在装载时的执行顺序也是根据脚本标签<script>的出现来顺序来决定。
<!DOCTYPE html>
<script>
console.log("顶部脚本");
</script>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script>
console.log("头部脚本");
</script>
</head>
<body>
<script>
console.log("页面脚本");
</script>
</body>
</html>
<script>
console.log("底部脚本");
</script>
还有对于通过脚本标签<script>的src属性导入的外部js文件脚本,它也将按照其语句出现的顺序来执行,而且执行过程是文档装载的一部分,不会因为是外部js文件而延期执行。
// 先加载 b.js 并且执行里面的代码
<script src="b.js"></script>
// 然后在按顺序执行下面的代码
<script>
console.log(1);
</script>
以上是关于JS执行顺序的主要内容,如果未能解决你的问题,请参考以下文章