三种角度解释href/src/link/import区别
网上查到的几种不同但比较容易理解的解释
解释一:
href是Hypertext Reference的缩写,表示超文本引用。用来建立当前元素和文档之间的链接。常用的有:link、a。例如:
<link href="reset.css" rel=”stylesheet“/>
浏览器会识别该文档为css文档,并行下载该文档,并且不会停止对当前文档的处理。这也是建议使用link,而不采用@import加载css的原因。
src是source的缩写,src的内容是页面必不可少的一部分,是引入。src指向的内容会嵌入到文档中当前标签所在的位置。常用的有:img、script、iframe。例如
<script src="script.js"></script>
当浏览器解析到该元素时,会暂停浏览器的渲染,直到该资源加载完毕。这也是将js脚本放在底部而不是头部得原因。
解释二:
href标识超文本引用,用在link和a等元素上,href是引用和页面关联,是在当前元素和引用资源之间建立联系
src表示引用资源,表示替换当前元素,用在img,script,iframe上,src是页面内容不可缺少的一部分。src是source的缩写,是指向外部资源的位置,指向的内部会迁入到文档中当前标签所在的位置;在请求src资源时会将其指向的资源下载并应用到当前文档中,例如js脚本,img图片和frame等元素。
补充: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 表示超文本引用(hypertext reference),在 link和a 等元素上使用。src 表示来源地址,在 img、script、iframe 等元素上。
src 的内容,是页面必不可少的一部分,是引入。href 的内容,是与该页面有关联,是引用。区别就是,引用和引入。
三种角度解释href/src/link/import区别的更多相关文章
- url,href,src之间的区别
发现自己居然没把url.href.src关系及使用搞清楚,今天就理一下.主要包括:url.src.href定义以及使用区别. URL(Uniform Resource Locator) 统一资源定位符 ...
- Http中的三种请求处理模式(MPM)的区别
MPM---包括基于事件/异步,线程化和预分叉 MPM(multi-processing module)多种请求处理模式,分为三种工作模式: prefork worker event prefork- ...
- link @import区别 src href的区别
先说页面引入css的四种方式吧 1 在头部写在style里面 2 行内样式 tyle= 3 外部引入 link和@import的区别 link属于XHTML的标签,而@import只是css提供的一种 ...
- url,href,src 之间的区别
url 统一资源定位符 <style> #bg{ background-image:url("img/bg.png"); } </style> 区别: sr ...
- 余弦相似度及基于python的三种代码实现、与欧氏距离的区别
1.余弦相似度可用来计算两个向量的相似程度 对于如何计算两个向量的相似程度问题,可以把这它们想象成空间中的两条线段,都是从原点([0, 0, ...])出发,指向不同的方向.两条线段之间形成一个夹角, ...
- 前端面试题1:Object.prototype.toString.call() 、instanceof 以及 Array.isArray()三种方法判别数组的优劣和区别
1. Object.prototype.toString.call() 每一个继承 Object 的对象都有 toString 方法,如果 toString 方法没有重写的话,会返回 [Object ...
- VMware中Bridged、NAT、host-only三种网络连接模式的原理及其区别
VMnet0:这是VMware用于虚拟桥接网络下的虚拟交换机: VMnet1:这是VMware用于虚拟Host-Only网络下的虚拟交换机: VMnet8:这是VMware用于虚拟NAT网络下的虚拟交 ...
- spring注解之@Import注解的三种使用方式
目录 1.@Import注解须知 2.@Import的三种用法 3.@Import注解的三种使用方式总结 @ 1.@Import注解须知 1.@Import只能用在类上 ,@Import通过快速导入的 ...
- OpenCV4Android释疑: 透析Android以JNI调OpenCV的三种方式(让OpenCVManager永不困扰)
OpenCV4Android释疑: 透析Android以JNI调OpenCV的三种方式(让OpenCVManager永不困扰) 前文曾详细探讨了关于OpenCV的使用,原本以为天下已太平.但不断有人反 ...
随机推荐
- UITableView定制左滑效果
UITableViewRowAction类 object defines a single action to present when the user swipes horizontally in ...
- Centos 7.6 安装selenium+firefox+google chrome(支持xshell运行)
1. 查看Linux 版本 [root@penguin selenium]# cat /etc/redhat-release CentOS Linux release 7.6.1810 (Core) ...
- PHP单表操作mysqli数据库类的封装
class DB{ private $options=array( 'database_type' => 'mysql', 'database_name' => 'test', 'serv ...
- python高级(五)—— python函数(一等对象)
本文主要内容 一等对象 普通函数 & 高阶函数 可调用对象 & 自定义可调用类型 函数内省 函数注释 python高级——目录 文中代码均放在github上:https://githu ...
- js对函数参数的封装
对函数参数的封装 一个原始函数有n个参数,用wrap对函数进行封装,生成一个新的函数,当给它传入参数数量为n的时候,将执行原始函数,否则不执行 //函数封装 function wrap(func){ ...
- 基于两阶段提交的分布式事务实现(UP-2PC)
引言:分布式事务是分布式数据库的基础性功能,在2017年上海MySQL嘉年华(IMG)和中国数据库大会(DTCC2018)中作者都对银联UPSQL Proxy的分布式事务做了简要介绍,受限于交流形式难 ...
- 关于z-index问题
关于z-inde,这个网址还是对我受益匪浅的,https://www.cnblogs.com/bigboyLin/p/4621335.html z-index 起作用得有一个前提: 就是和定位一起用, ...
- # js设置键名和键值de坑
js设置键名和键值 let obj1 = {'jifeng': 60, 'lilu': 59, 'hongyan': 51, 'donghan': 4, 'liudan': 18, 'liuhaiya ...
- Cloudera Manager安装之Cloudera Manager 5.6.X安装(tar方式、rpm方式和yum方式) (Ubuntu14.04) (三)
见 Ubuntu14.04下完美安装cloudermanage多种方式(图文详解)(博主推荐) 欢迎大家,加入我的微信公众号:大数据躺过的坑 免费给分享 同时,大家可以关注我的个人 ...
- c++ 网络编程(六)LINUX下 socket编程 多播与广播 实现一次发送所有组客户端都能接收到
原文作者:aircraft 原文链接:https://www.cnblogs.com/DOMLX/p/9614288.html 一.多播 锲子:有这么一种情况,网络电台可能需要同时向成千上万的用户传输 ...