学习知识点分享 src与herf的区别
href表示超文本引用，用在link和a等元素上，href是引用和页面关联，是在当前元素和引用资源之间建立联系
src表示引用资源，表示替换当前元素，用在img，script，iframe上，src是页面内容不可缺少的一部分。
src是source的缩写，是指向外部资源的位置，指向的内部会迁入到文档中当前标签所在的位置；在请求src资源时会将其指向的资源下载并应用到当前文档中，
例如js脚本，img图片和frame等元素。
<script src="js.js"></script>当浏览器解析到这一句的时候会暂停其他资源的下载和处理，直至将该资源加载，
编译，执行完毕，图片和框架等元素也是如此，类似于该元素所指向的资源嵌套如当前标签内，这也是为什么要把js放在底部而不是头部。
<link href="common.css" rel="stylesheet"/>当浏览器解析到这一句的时候会识别该文档为css文件，会下载并且不会停止对当前文档的处理，
这也是为什么建议使用link方式来加载css而不是使用@import。
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不支持。
它们之间的主要区别可以用这样一句话来概括：src用于替代这个元素，而href用于建立这个标签与外部资源之间的关系。
例如：
<a href="www.xxx.com">\<\img src="1.jpg">\</a>
a标签里面的内容是一张图片，a标签加上href属性将图片链接到了www.xxx.com这个网站，但并未替换a标签里面的内容，而img标签的src属性则是将这个标签完全替换成了src里面的资源。
href (Hypertext Reference) 超文本引用href这个属性指定web资源的位置，从而定义当前元素（如锚点a）或当前文档（如链接）与目标锚点或目标资源之间的联系。
例如当我们写：
<link href="style.css" rel="stylesheet" />
浏览器知道这是个样式表文件，html的解析和渲染不会暂停，css文件的加载是同时进行的，这不同于在style标签里面的内置样式，
用@import添加的样式是在页面载入之后再加载，这可能会导致页面因重新渲染而闪烁。所以我们建议使用link而不是@import。
src (Source)源这个属性是将资源嵌入到当前文档中元素所在的位置。例如当我们写：
<script src="script.js"></script>
当浏览器解析到这句代码时，页面的加载和解析都会暂停直到浏览器拿到并执行完这个js文件。
这就像是把js文件里的内容全部注入到这个script标签中，类似于img，img标签是一个空标签，它的内容就是由src这个属性定义，
浏览器会暂停加载直到这个图片加载完成。这也是为什么要将js文件的加载放在body最后的原因（在</body>前面）。
学习知识点分享 src与herf的区别相关推荐
- url、src、herf的区别
1.url:统一资源定位符 互联网上的每个文件都有一个唯一的URL,它包含的信息指出文件的位置以及浏览器应该怎么处理它 结构 基本URL包含协议.服务器名称(IP地址).路径和文件名,如:" ...
- js怎么在一个div中嵌入另一网站_好程序员web前端学习路线分享HTML5常见面试题集锦一...
好程序员web前端学习路线分享HTML5常见面试题集锦,接下来将会持续为大家分享几篇HTML5常见面试题. 1.布局 左边20% 中间自适应 右边200px 不能用定位 答案:圣杯布局/双飞翼布局或者 ...
- 自学python-python自学起来难不难？python学习路线分享
Python算是编程里最简单的一门语言了,很多人依然学不会,找不到方法很麻烦,选择大于努力,就比如有的人东学一点西学一点,始终得不到要领,终归原因是学习方法有错误,有的人今天学一些后天学一些,三天打鱼 ...
- xducs学习经验分享
西电计科课程学习 本文的主要内容是结合本人的一些想法与观点以及优秀学长的学习经验,对西电CS所开设课程分学期进行一个比较清晰而全面详尽的剖析与学习经验&学习技巧分享,希望能够对计科学弟学妹 ...
- MyBatis基础学习知识点2
本文衔接MyBatis基础学习知识点1,继续对以下两个问题进行探讨 1.dao配置文件主要是用来干什么的?如何进行配置? 2.使用测试方法测试程序运行是如何实现的?每条语句起什么作用? 目录 dao配 ...
- HTML学习知识点大全-----超详细(各种标签使用讲解及案例)
HTML学习知识点大全-----超详细(各种标签使用讲解及案例) 1:概念 **最基础的网页开发语言 *Hyper Text Markup language:超文本标记语言超文本:运用了超链接的方法, ...
- C/C++ Linux后台服务器开发高级架构师学习知识点路线总结（2021架构师篇完整版）
C/C++ Linux后台服务器开发高级架构师学习知识点路线总结(2021架构师篇完整版) 前言: 小编之前有跟大家分享过一篇架构师体系知识点总结的文章,今天在原来的基础上有所改变更新(2021版). ...
- C/C++ Linux后台服务器开发高级架构师学习知识点路线总结（2022架构师篇完整版）
C/C++ Linux后台服务器开发高级架构师学习知识点路线总结(2021架构师篇完整版) 前言: 小编之前有跟大家分享过一篇架构师体系知识点总结的文章,今天在原来的基础上有所改变更新(2021版). ...
- 尚硅谷Vue2学习笔记分享
前言 这里是尚硅谷Vue2的学习笔记分享. 原视频是尚硅谷Vue2.0+Vue3.0全套教程丨vuejs从入门到精通 Vue3的笔记链接 文章目录 前言 初识Vue 模板语法 数据绑定 el和data ...
最新文章
- 美国本科计算机专业,美国本科计算机专业的最新排名介绍
- 数据库：B+树索引和Hash索引得区别
- 如何有效的压缩虚拟磁盘
- MUI - 解决bug: iphone页面保存时popPicker自动弹出来
- 线上服务器内存分析及问题排查
- 免费设计图标的网站；免费设计的网站；免费设计的网站；
- keras编写自定义的层
- 微软开源C++ REST SDK——Casablanca
- 梦到两个人辞职，一男一女
- 00.springboot 操作数据库的封装
- 【windows】win10录屏录屏内声音
- sierpinski三角形的维数_遥感图象分形维数的几种估计算法研究
- Android 提升效率
- c语言abs作用是什么意思,c语言fabs()是什么意思？和abs()有什么区别
- 博客外链怎么做？利用博客做外链还有效嘛
- zencart模板列表下载地址
- 程序员的算法趣题Q67: 不挨着坐是一种礼节吗？
- foxmail导入csv邮箱联系人乱码
- js禁止退格键(Backspace)
- 苹果放新卡显示无服务器,苹果6插卡无服务怎么办