写代码的时候就经常把这两个属性弄混淆,到底是href还是src,href标识超文本引用,用在linka等元素上,href是引用和页面关联,是在当前元素和引用资源之间建立联系,src表示引用资源,表示替换当前元素,用在imgscriptiframe上,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不支持。

  

html中的src与href的区别的更多相关文章

  1. 浅析src与href的区别

    src与href的区别 SRC src用于替换当前元素,href用于在当前文档和引用资源之间确立联系. src是source的缩写,指向外部资源的位置,指向的内容将会嵌入到文档中当前标签所在位置:在请 ...

  2. 浅谈src与href的区别

    src 和 href 都是用来引入外部资源的属性,例如:图片.视频.CSS 文件.JavaScript 文件等. 那么它们两者之间究竟有什么样的区别呢? <link href="sty ...

  3. src和href的区别

    <html><!--头部标签--><!--src和href的区别src:引用,该资源是页面不可缺少的一部分,如(img标签 video标签 radio标签);href:引 ...

  4. html中src与href的区别

    概述 src和href之间存在区别,能混淆使用.src用于替换当前元素,href用于在当前文档和引用资源之间确立联系. src src是source的缩写,指向外部资源的位置,指向的内容将会嵌入到文档 ...

  5. url 、src 、href 的区别

    url.href.src 详解 现自己居然没把url.href.src关系及使用搞清楚,今天就理一下.主要包括:url.src.href定义以及使用区别. URL(Uniform Resource L ...

  6. src与href的区别

    href: 是指向网络资源所在位置,建立和当前元素(锚点)或当前文档(链接)之间的链接,用于超链接. src:是指向外部资源的位置,指向的内容将会嵌入到文档中当前标签所在位置:在请求src资源时会将其 ...

  7. [html] src与href的区别

    src用于替换当前元素,href用于在当前文档和引用资源之间确立联系. src是source的缩写,指向外部资源的位置,指向的内容将会嵌入到文档中当前标签所在位置:在请求src资源时会将其指向的资源下 ...

  8. src 和 href 的区别

    因为理解不深,到写外部加载Javascript文件或者css文件的时候总是需要去找个例子,这样可不好.现在总结下 href 属性规定被链接文档的位置(URL). href是hyperrefresh的缩 ...

  9. 简述一下 src 与 href 的区别

    href 是指向网络资源所在位置,建立和当前元素(锚点)或当前文档(链接)之间的链接,用于超链接. src是指向外部资源的位置,指向的内容将会嵌入到文档中当前标签所在位置:在请求src资源时会将其指向 ...

随机推荐

  1. SAP数据更新的触发

    SAP 应用系统架构         应用层运行着DIALOG进程,每个DIALOG进程绑定一个数据库进程,DIALOG进程与GUI进行通信,每次GUI向应用服务器发送请求时都会通过dispatche ...

  2. Android性能优化--Listview优化

    ListView的工作原理 首先来了解一下ListView的工作原理(可参见http://mobile.51cto.com/abased-410889.htm),如图: ListView 针对每个it ...

  3. iOS--页面间的代理传值(属性、代理(委托)、代码块、单例、通知)

    (一)属性传值 (二)代理(委托)传值 代理传值 适用于 反向传值 (从后往前传) 1.1 创建协议 及协议方法 在反向传值的页面(SecondViewController)中 1.2 创建协议类型的 ...

  4. iOS UIWebView和网页的交互(OC中调执行JS)

    UIWebView和网页的交互(OC中调执行JS)- (void)viewDidLoad{[super viewDidLoad];// 1.webViewUIWebView *webView = [[ ...

  5. Windows7下Blend for Visual Studio 2012使用问题

    目前开发的系统里很多控件样式和动画比较复杂,应该是之前同事用Blend做的,这种神器不用太浪费了,自己也准备试试. 系统环境Windows7+Visual Studio 2012 1.Windows7 ...

  6. iOS开发之网络编程--使用NSURLConnection实现大文件下载

    主要思路(实现下载数据分段写入缓存中) 1.使用NSURLConnectionDataDelegate以及代理方法.2.在成功获取响应的代理方法中,获得沙盒全路径,并在该路径下创建空文件和文件句柄.3 ...

  7. 网络编程1--毕向东java基础教程视频学习笔记

    目录: 01 网络编程概述1 02 网络编程概述2 03网络编程 网络模型 04网络编程 IP地址 05网络编程 TCP和UDP 06网络编程 Socket 07网络编程 UDP发送端 01 网络编程 ...

  8. 通过XmlSerializer 实现XML的序列化与反序列化

    通过XmlSerializer 我们可以十分简单的将Model与XML进行转换 官文在点这里 帮助类 using System; using System.Text; using System.Xml ...

  9. windows 搭建 solr 5.3.2

    1. Tamcat 的安装,此不介绍 路径:F:\SolrTest\apache-tomcat-8.0.18 2. 解压 solr 5.3.2 路径:F:\Tool\solr-5.3.2 3. 复制s ...

  10. 两台SQL Server数据同步解决方案

    复制的概念 复制是将一组数据从一个数据源拷贝到多个数据源的技术,是将一份数据发布到多个存储站点上的有效方式.使用复制技术,用户可以将一份数据发布到多台服务器上,从而使不同的服务器用户都可以在权限的许可 ...