2.对于script标签的放置位置

最新推荐文章于 2023-04-26 19:54:11 发布

飞天阁

最新推荐文章于 2023-04-26 19:54:11 发布

阅读量1k

点赞数 2

分类专栏： JavaScript 你不知道的JavaScript系列文章标签： JavaScript HTML script

本文链接：https://blog.csdn.net/qq_35682092/article/details/90143470

版权

4 篇文章 0 订阅

订阅专栏

4 篇文章 0 订阅

订阅专栏

使用<script>元素有两种方式一种是在页面嵌入JavaScript代码，一种就是包含外部JavaScript文件

包含在<script>标签内部的JavaScript代码将被从上至下依次解释

<script type="text/javascript">

var h = "hello";

function sayh(params) {

alert(h);

}

sayh();

</script>

按这个例子来说，解释器会解释一个函数的定义，然后将定义保存在自己环境里，在解释器对<script>标签内部的

所有代码求值前，页面其余内容不会被浏览器显示

所以虽然<script>标签可以head ，body ，body 后面。但是没有必要需求的话，

因为html是顺序执行，所以放在head里面如果JavaScript脚本很大，会影响网站打开速度

如果放在body里面效果是先把网站内容展现后，再加载JavaScript脚本，所以用户会感觉网站加载很快

而放在body后面是把页面内容全部加载后再运行JavaScript脚本，这样如果JavaScript需要改变DOM的话，就会出现一瞬间的闪烁，

所以一般都把全部JavaScript引用放在<body>元素中页面内容的后面。但是我更推荐使用async属性

异步下载JavaScript脚本

使用方法是

<script type="text/javascript" src="脚本路径" async></script>

这样使用意味着不会阻塞页面的正常渲染

JavaScript脚本很小的情况下，放哪里都无所谓的.

所以 async>body>head

还有在使用<script>标签时需要正确的使用闭合标签，这样是防止xss 跨站脚本

关注

专栏目录