-
2022-05-16 20:11:12
src和href的作用都是用于请求资源。
区别:
1.请求资源类型不同
href,超文本引用,用于建立文档与资源的联系,常用的有:link、a。
src,将其所指向的资源下载并应用到当前页面,常见的有script、img。
2.作用结果不同
href,用于文档与资源之间确立联系。
src,请求到的资源替换当前内容。
3.浏览器的解析不同
href,将资源解析成css文件,并行加载请求资源,不会阻塞对当前文档的处理。
src,会暂停其他资源的处理,直到该资源加载、解析和执行完毕,将其所指向资源应用到当前内容。这也是为什么把js文件放在底部而不是头部发热原因。更多相关内容 -
浅谈HTML中src和href之间的区别
2021-01-19 17:24:03简单来说 src 就是 “我想加载这个资源”,而 href 就是 “我想和这个资源建立关联” src 主要用于元素替换,href 用于和相关文档和外部资源建立相关链接。 href 属性说明本地Web资源和定义的资源建立了链接。 如: ... -
href和src、link和@import的区别详解
2021-01-19 20:45:30href和src的区别: href(Hypertext Reference):超文本引用,常用的标签有link、a等,用来链接引用的外部资源。在当前元素或者当前文档和由当前属性定义的需要的锚点或资源之间定义一个链接或者关系,如: <link ... -
HTML的src和href的区别
2022-04-19 16:19:50HTML的src和href的区别 两者分别是什么 href标识超文本引用,全称hypertext reference,用在link和a等元素上,href是引用和页面关联,是在当前元素和引用资源之间建立联系 src表示引用资源,全称source表示替换当前...HTML的src和href的区别
两者分别是什么
href标识超文本引用,全称hypertext reference
,用在link和a等元素上,href是引用和页面关联,是在当前元素和引用资源之间建立联系
src表示引用资源,全称source
表示替换当前元素,用在img,script,iframe上,src是页面内容不可缺少的一部分。不同点
1.请求资源不同
(1)
href
是Hypertext Reference
的缩写,表示超文本引用。用来建立当前元素和文档之间的链接。常用的有:link
、a
。(2)在请求
src
资源时会将其指向的资源下载并应用到文档中,常用的有script
,img
、iframe
;
2.作用结果不同(1)
href
用于在当前文档和引用资源之间确立联系;(2)
src
用于替换当前内容;
3.浏览器解析方式不同(1)若在文档中添加href ,浏览器会识别该文档为 CSS 文件,就会并行下载资源并且不会停止对当前文档的处理。这也是为什么建议使用 link 方式加载 CSS,而不是使用 @import 方式。
(2)当浏览器解析到src ,会暂停其他资源的下载和处理,直到将该资源加载、编译、执行完毕,图片和框架等也如此,类似于将所指向资源应用到当前内容。这也是为什么建议把 js 脚本放在底部而不是头部的原因。
link和import的区别
两者都是外部引用CSS的方式,但是存在一定的区别:
区别1:link是XHTML标签,除了加载CSS外,还可以定义RSS等其他事务;@import属于CSS范畴,只能加载CSS。
区别2:link引用CSS时,在页面载入时同时加载;@import需要页面网页完全载入以后加载。
区别3:link是XHTML标签,无兼容问题;@import是在CSS2.1提出的,低版本的浏览器不支持。
区别4:ink支持使用Javascript控制DOM去改变样式;而@import不支持。
资料来源于:[href和src的区别] (https://juejin.cn/post/7022979704957173767)
部分来源于 W3C -
简述一下 src 和 href 的区别?
2021-12-18 09:33:22简述一下 src 和 href 的区别 简述一下 src 和 href 的区别 简述一下 src 和 href 的区别 -
href和src的区别
2022-06-07 19:25:44href和src都是用来引用外部资源的属性。例如:网址、图片、视频、css文件、js文件等。href(Hypertext Reference)超文本引用,用来建立当前元素和文档之间的连接。常用有link、a标签等。当它引用资源时,浏览器会将...href和src都是用来引用外部资源的属性。例如:网址、图片、视频、css文件、js文件等。
href(Hypertext Reference)超文本引用,用来建立当前元素和文档之间的连接。常用有link、a标签等。当它引用资源时,浏览器会将其识别为CSS文档,并行下载资源并且不会停止对当前文档的处理。
src(Source)会将指向的资源下载并引用到当前的文档中,常用标签有script、img、ifram等。它会替换掉当前的元素。当浏览器解析src时,会暂停其他资源的下载和处理,直接将该资源下载、编译、执行完毕。
href会建立一个关联指向资源,而src则是将资源嵌入当前文档中,如下面代码图。
-
href和src的区别?
2022-06-14 10:35:25href和src的区别?href:
href是HypertextReference的缩写,表示超文本引用。用来建立当前元素和文档之间的链接。常用的有:link、a。
浏览器会识别该文档为css文档,并行下载该文档,并且不会停止对当前文档的处理。
这也是建议使用link,而不采用@import加载css的原因。
src:
src是source的缩写,src的内容是页面必不可少的一部分,是引入。
src指向的内容会嵌入到文档中当前标签所在的位置。常用的有:img、script、iframe。
当浏览器解析到该元素时,会暂停浏览器的渲染,直到该资源加载完毕。【阻塞程序】
这也是将js脚本放在底部而不是头部得原因。补充link的特殊用法
1、通过 rel=“preload” 进行内容预加载
<link rel="preload" href="styles/index.css" as="style"> <link rel="preload" href="main.js" as="script" />
好处
元素的 rel 属性的属性值 preload 能够让你在你的 HTML 页面中 元素内部书写一些声明式的资源获取请求,可以指明哪些资源是在页面加载完成后即刻需要的。对于这种即刻需要的资源,你可能希望在页面加载的生命周期的早期阶段就开始获取,在浏览器的主渲染机制介入前就进行预加载。这一机制使得资源可以更早的得到加载并可用,且更不易阻塞页面的初步渲染,进而提升性能。
link中使用as的好处
1、更精确地优化资源加载优先级。
2、匹配未来的加载需求,在适当的情况下,重复利用同一资源。
3、为资源应用正确的内容安全策略。
4、为资源设置正确的 Accept 请求头。参考 https://www.jianshu.com/p/d293a4330246
2、rel=“prefetch”
<link rel="prefetch" href="/assets/js/10.0437ec43.js">
此属性可以给其链接的页面预加载一部分资源,可以使其打开速度提高。兼容性较好。
与此类似的rel=“prefetcher”属性加载页面全部资源,迅速打开,兼容不好。 -
src与href的区别
2022-03-02 23:25:17src和href的区别 1、请求资源类型不同 src资源时会将其指向的资源下载并应用到文档中 href表示超文本引用 2、作用结果不同 src用于替换当前内容 href用于在当前文档和引用资源之间确立联系 3、浏览器解析方式不同 ... -
src和href的区别 前端基础面试题
2022-06-04 02:22:27src和href的区别 前端基础面试题 -
HTML中src和href之间的区别
2020-09-01 10:46:00简单来说 src 就是 “我想加载这个资源”,而 href 就是 “我想和这个资源建立关联” src 主要用于元素替换,href 用于和相关文档和外部资源建立相关链接。 href 属性说明本地Web资源和定义的资源建立了链接。 如... -
src与href属性的区别
2020-09-22 14:18:19src和href之间存在区别,能混淆使用。src用于替换当前元素,href用于在当前文档和引用资源之间确立联系。 -
【前端知识之HTML】src和href的区别以及defer和async的区别
2022-05-08 22:25:18本系列主要整理前端面试中需要掌握的知识点。本节介绍src和href区别的相关知识。 -
src和href的区别?
2019-04-10 14:41:031.src 是指向物件的来源地址,是引入。在 img、script、iframe 等元素上使用。...href用于在当前文档和引用资源之间建立联系。 使用区别: src通常用作“拿取”(引入),href 用作 “连结前往”(引用)。 ... -
【面试】面试官:src和href的区别
2022-05-13 18:25:232、作用结果不同 (1)href 用于文档和资源之间确立联系; (2)src 用于替换当前内容; 3、浏览器解析方式不同 (1)用href,浏览器会识别该文档为 CSS 文件,就会并行下载资源并且不会停止对当前文档的处理。 (2... -
src、href区别
2020-11-10 09:26:48区别:src用于替代这个元素,而href用于建立这个标签与外部资源之间的关系。 例如: a标签里面的内容是一张图片,a标签加上href属性将图片链接到了www.xxx.com这个网站,但并未替换a标签里面的内容,而img标签的... -
href和src区别
2022-03-09 16:39:51href和src区别 -
src和href的区别,并且img中的srcset的作用是什么?
2022-04-16 15:35:14一、src和href的区别 src是指向外部资源的位置,指向的内容会嵌⼊到⽂档中当前标签所在的位置,在请求src资源时会将其指向的资源下载并应⽤到⽂档内,如js脚本,img图⽚和frame等元素。当浏览器解析到该元素时,会... -
html中的src与href的区别
2020-08-05 12:00:38写代码的时候就经常把这两个属性弄混淆,到底是href还是src,href表示超文本引用,用在link和a等元素上,href是引用和页面关联,是在当前元素和引用资源之间建立联系,src表示引用资源,表示替换当前元素,用在img,...