href和src的定义与区别

href和src的定义与区别

一、总结

一句话总结:

1、href (Hypertext Reference)网络资源的位置,浏览器识别当前资源是一个样式表,页面解析不会暂停(由于浏览器需要样式规则去画或者渲染页面,渲染过程可能会被被暂停)。这与把css文件内容写在<style>标签里不相同,因此建议使用link标签而不是@import来把样式表导入到html文档里。
2、src (Source)属性仅仅 嵌入当前资源到当前文档元素定义的位置,在浏览器下载,编译,执行这个文件之前页面的加载和处理会被暂停。这个过程与把js文件放到<script>标签里类似。这也是建议把JS文件放到底部加载的原因。当然,img标签页与此类似。浏览器暂停加载直到提取和加载图像。

1、浏览器对href (Hypertext Reference)资源解析的特点?

a、【网络资源的位置】:href (Hypertext Reference)表示网络资源的位置
b、【样式表】:浏览器识别当前资源是一个样式表
c、【页面解析不会停、页面渲染可能停】:页面解析不会暂停(由于浏览器需要样式规则去画或者渲染页面,渲染过程可能会被被暂停)
d、【link引入了@import引入的区别】:因此建议使用link标签而不是@import来把样式表导入到html文档里

2、浏览器对src (Source)资源解析的特点?

1、【嵌入资源的位置】:src (Source)属性仅仅 嵌入当前资源到当前文档元素定义的位置
2、【浏览器暂停】:在浏览器下载,编译,执行这个文件之前页面的加载和处理会被暂停
3、【js写在底部的原因】:这也是建议把JS文件放到底部加载的原因
4、【所以img也是src】:当然,img标签页与此类似。浏览器暂停加载直到提取和加载图像。

二、href和src的定义与区别

博客对应课程的视频位置:

1、href (Hypertext Reference)网络资源的位置,浏览器识别当前资源是一个样式表,页面解析不会暂停(由于浏览器需要样式规则去画或者渲染页面,渲染过程可能会被被暂停)。这与把css文件内容写在<style>标签里不相同,因此建议使用link标签而不是@import来把样式表导入到html文档里。
2、src (Source)属性仅仅 嵌入当前资源到当前文档元素定义的位置,在浏览器下载,编译,执行这个文件之前页面的加载和处理会被暂停。这个过程与把js文件放到<script>标签里类似。这也是建议把JS文件放到底部加载的原因。当然,img标签页与此类似。浏览器暂停加载直到提取和加载图像。

 
原文地址:https://www.cnblogs.com/Renyi-Fan/p/12714383.html