Erlo

为什么css放上面js放下面

时间:2021-01-27   阅读:68次   来源:php中文网
页面报错
点赞
原文:https://www.php.cn/css-tutorial-469348.html

css放上面js放下面的原因:1、在加载html生成DOM tree的时候,可以同时对DOM tree进行渲染,这样可以防止闪跳,白屏或者布局混乱;2、javascript加载后会立即执行,同时会阻塞后面的资源加载。

本文操作环境:Windows7系统、HTML5&&CSS3版,DELL G3电脑。

推荐:css视频教程

href和src的区别

一般加载CSS用href,并放在头部;加载script用src,放在body内的下方。

href

是hypertext reference的缩写,表示超文本引用,用来建立当前元素和文档间的链接。常用的有link,a。

当CSS使用href引用,浏览器会识别该文档问CSS,并行下载,不会停止对当前文档的加载。

src

是source的缩写,是资源,页面必不可少的一部分,src指向的内容会嵌入到文档中当前标签的位置。常用的有img, script, iframe。

当script使用src引用,浏览器解析到该元素时会停止对文档的渲染,直到该资源加载完成。这也是将script放底部而不是头部的原因。

把CSS放头部,script放下方的原因

1、CSS放头部

在加载html生成DOM tree的时候,就可以同时对DOM tree进行渲染。

这样可以防止闪跳,白屏或者布局混乱。

2、javascript放在后面

javascript可能会改变DOM tree的结构,所以需要一个稳定的DOM tree。

javascript加载后会立即执行,同时会阻塞后面的资源加载。(javascript加载和执行的特点)

拓展知识:

1、首先让我们先认识几个常见的问题:

1.在进行页面优化的时候,需要将css放在头部,将js文件放在尾部,这样做为什么能够实现页面的优化?

2.在使用jquery的时候,为什么把函数写在$(document).ready()事件中?

3.javascript会阻塞dom的解析。

当解析过程中遇到

提交留言

评论留言

还没有评论留言,赶紧来抢楼吧~~

吐槽小黑屋()

* 这里是“吐槽小黑屋”,所有人可看,只保留当天信息。

  • Erlo吐槽

    Erlo.vip2021-06-25 20:16:52Hello、欢迎使用吐槽小黑屋,这就是个吐槽的地方。
  • 返回顶部

    给这篇文章打个标签吧~

    棒极了 糟糕透顶 好文章 PHP JAVA JS 小程序 Python SEO MySql 确认