HTML中的href和src有什么区别?

加载js的时候,用到的是<script style='text/javascript' src='js/demo.js'></script>
加载css的时候,用到的是<link rel="stylesheet" href="css/demo.css"/>
一个用到的是src,另一个用到的是href,这两个有什么区别呢?
 
href 表示超文本引用(hypertext reference),在 link和a 等元素上使用。
src 表示来源地址,在 img、script、iframe 等元素上。
src 的内容,是页面必不可少的一部分,是引入。href 的内容,是与该页面有关联,是引用。区别就是,引入和引用。

href (Hypertext Reference)指定网络资源的位置,从而在当前元素或者当前文档和由当前属性定义的需要的锚点或资源之间定义一个链接或者关系。当我们写下:

<link href="style.css" rel="stylesheet" />

浏览器明白当前资源是一个样式表,页面解析不会暂停(由于浏览器需要样式规则去画或者渲染页面,渲染过程可能会被暂停)。这与把css文件内容写在<style>标签里不相同,因此建议使用link标签而不是@import来吧样式表导入到html文档里。

src (Source)属性   嵌入当前资源到当前文档元素定义的位置。当浏览器找到

<script src="script.js"></script>

在浏览器下载,编译,执行这个文件之前页面的加载和处理会被暂停。这个过程与把js文件放到<script>标签里类似。这也是建议把JS文件放到底部加载的原因。当然,img标签页与此类似。浏览器暂停加载直到提取和加载图像。

 

scr 和 href 区别的更多相关文章

  1. window.location.assign和window.location.href区别

    window.location.assign和window.location.href区别 window.location.assign(url)和window.location.href=url实现 ...

  2. HTML中关于url、scr、href的区别

    URL是什么 URL:Uniform Resource Locators(统一资源定位器)的简写,Web浏览器通过URL从Web服务器请求页面. url不是属性,src和href是属性,src用于替换 ...

  3. window.location.Reload()和window.location.href 区别

    首先介绍两个方法的语法: reload 方法,该方法强迫浏览器刷新当前页面.语法:location.reload([bForceGet])参数: bForceGet, 可选参数, 默认为 false, ...

  4. window.location.replace()与window.location.href()区别

    有3个页面 a,b,c 如果当前页面是c页面,并且c页面是这样跳转过来的:a->b->c 1:b->c 是通过window.location.replace("..xx/c ...

  5. href="javascript:;" href="javascript:void(0);" href="#"区别

    一.href="javascript:;" 这种用法不正确,这么用的话会出现浏览器访问"javascript:;"这个地址的现象: 二.href="j ...

  6. parent.location.href和location.href区别

    parent.location.href='ind.php'parent用于框架结构,需要全网页转向如果你的网页是左右框架,那么,直接把当前页面全部转到ind.php中 location.href=' ...

  7. window.location.replace和window.location.href区别

    有3个页面 a,b,c 如果当前页面是c页面,并且c页面是这样跳转过来的:a->b->c 1:b->c 是通过window.location.replace("..xx/c ...

  8. href="javacript:;" href="javacript:void(0);" href="#"区别。。。

    一.href="javacript:;"  这种用法不正确,这么用的话会出现浏览器访问“javascript:;”这个地址的现象: 二.href="javacript:v ...

  9. a标签中href="javacript:;" href="javacript:void(0);" href="#"区别

    在使用<a>标签时,经常会绑定其他事件比如onclick,这时候我们会给<a>标签的href属性赋值为“#”,“javacript:;”,“javacript:void(0); ...

随机推荐

  1. Flask中的的SQLAlchemy2

    昨天更新了博客不知对各位职场的大佬有没有帮助,如果没有看到的请用小手狠狠地戳这里 Flask中的的SQLAlchemy 今天呢,我们来说一下多对多表的关系,知道不?开始之前我先说一个事,昨晚更新了博客 ...

  2. 《springcloud 四》服务保护机制

    服务保护机制SpringCloud Hystrix 微服务高可用技术 大型复杂的分布式系统中,高可用相关的技术架构非常重要. 高可用架构非常重要的一个环节,就是如何将分布式系统中的各个服务打造成高可用 ...

  3. 记一次坑爹的jconsole使用

    之前一直是用jstat来监控GC的,后来发现原来有个自带的jconsole,是可始化界面的,而且也是oracle公司自带的工具,与是拿来用一下,发现蛮好用的. 然而,在一次复现实验中,发现原来能复现的 ...

  4. mysql 数据库8.0版本,jdbc驱动连接问题

    前言 8.0版本的mysql数据的连接 与 5.0的有所不同,下面直接贴出  8.0版本应该有的 jdbc驱动连接,还有 mysql 的jdbc jar包要8.0以上的 内容如下 : jdbc.dri ...

  5. 吴恩达《Machine Learning Yearning》总结(1-10章)

    1.为什么选择机器学习策略 案例:建立猫咪图像识别app 系统的优化可以有很多的方向: (1)获取更多的数据集,即更多的图片: (2)收集更多多样数据,如处于不常见的位置的猫的图,颜色奇异的猫的照片等 ...

  6. bzoj 5303: [Haoi2018]反色游戏

    Description Solution 对于一个有偶数个黑点的连通块,只需要任意两两配对,并把配对点上的任一条路径取反,就可以变成全白了 如果存在奇数个黑点的连通块显然无解,判掉就可以了 如果有解, ...

  7. spring-boot 1.4.x遇到的cpu高的问题

    如果你的spring-boot应用里tomcat线程耗cpu较高,并主要耗在做读取jar的操作上(堆栈类似下面),可能跟我们遇到同样的问题. CRC32.update(byte[], int, int ...

  8. Java原生隐藏字符-工具类

    package com.seesun2012.common.util; /** 隐藏字符-工具类 @author seesun2012@163.com */ public class HiddenCh ...

  9. mysql六:mysql内置功能(视图、触发器、事务、存储过程、函数)

    一.视图 视图是一个虚拟表(非真实存在),其本质是[根据SQL语句获取动态的数据集,并为其命名],用户使用时只需使用[名称]即可获取结果集,可以将该结果集当做表来使用. 通过使用视图可以把查询过程中的 ...

  10. Drupal中hook_theme函数用法

    在开发的时候不免要使用到drupal theme 定义.举个简单的例子: 复制代码 代码如下: <?phpfunction modulename_theme() { //开始定义自己的theme ...