url、src、href定义以及使用区别

URL(Uniform Resource Locator)

统一资源定位符是对可以从互联网上得到的资源的位置和访问方法的一种简洁的表示,是互联网上标准资源的地址。互联网上的每个文件都有一个唯一的URL,它包含的信息指出文件的位置以及浏览器应该怎么处理它。

url分为相对url和绝对url:

1、绝对URL

绝对URL(absolute URL)显示文件的完整路径,这意味着绝对URL本身所在的位置与被引用的实际文件的位置无关。

2、相对URL

相对URL(relative URL)以包含URL本身的文件夹的位置为参考点,描述目标文件夹的位置。如果目标文件与当前页面(也就是包含URL的页面)在同一个目录,那么这个文件的相对URL仅仅是文件名和扩展名,如果目标文件在当前目录的子目录中,那么它的相对URL是子目录名,后面是斜杠,然后是目标文件的文件名和扩展名。

如果要引用文件层次结构中更高层目录中的文件,那么使用两个句点和一条斜杠。可以组合和重复使用两个句点和一条斜杠,从而引用当前文件所在的硬盘上的任何文件,一般来说,对于同一服务器上的文件,应该总是使用相对URL,它们更容易输入,而且在将页面从本地系统转移到服务器上时更方便,只要每个文件的相对位置保持不变,链接就仍然是有效地。

href和src 的定义与区别:

href和src是有区别的,而且是不能相互替换的。我们在可替换的元素上使用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标签页与此类似。浏览器暂停加载直到提取和加载图像。

与img类似的有更多:replaced elements。

时间: 2024-10-16 05:36:02

url、src、href定义以及使用区别的相关文章

url、href、src 详解

URL(Uniform Resource Locator)统一资源定位符是对可以从互联网上得到的资源的位置和访问方法的一种简洁的表示,是互联网上标准资源的地址.互联网上的每个文件都有一个唯一的URL,它包含的信息指出文件的位置以及浏览器应该怎么处理它. 结构基本URL包含模式(或称协议).服务器名称(或IP地址).路径和文件名,如“协议://授权/路径?查询”.完整的.带有授权部分的普通统一资源标志符语法看上去如下:协议://用户名:密码@子域名.域名.顶级域名:端口号/目录/文件名.文件后缀?

link @import区别 src href的区别

先说页面引入css的四种方式吧 1 在头部写在style里面 2 行内样式 tyle= 3 外部引入 link和@import的区别 link属于XHTML的标签,而@import只是css提供的一种方式 link除了加载css还能做其他的事情,比如定义RSS 而@import只能加载css link在页面加载的时候会被同时加载 比较快 @import会在页面全部加载完后再加载 比较慢 有兼容问题 link兼容性好 @import在IE5以上才支持 =======================

href=#与href=javascriptvoid(0)的区别

#"包含了一个位置信息 默认的锚点是#top 也就是网页的上端 而javascript:void(0)  仅仅表示一个死链接 这就是为什么有的时候页面很长浏览链接明明是#可是跳动到了页首 而javascript:void(0) 则不是如此 所以调用脚本的时候最好用void(0) 或者<input onclick> <div onclick>等 打开新窗口链接的几种办法 1.window.open('url') 2.用自定义函数 <script>       

img, script, link 的 src/href 为空时的bug

重复加载 这个 bug 并不新鲜.早在 2009 年,Nicholas C. Zakas 就发现了空 src 的危害性:Empty image src can destroy your site. Nicholas 的发现可以概括为一句话:img, script, link 的 src/href 为空时,有可能会导致冗余请求. 今天这个 bug 的起因,可以补充 Nicholas 的发现:CSS 里,background url 为空时,也有可能会导致冗余请求. 除了空值,还有一个值也会出问题:

[转]android中OnTouch和OnClick、 imagebutton的src和background有什么区别

1.OnTouch和OnClick有何区别? 专业回答 1.onClick就传入一个View对象,而 onTouch要传入一个View 对象和 MotionEvent的对象2.onTouch对控件的操作比onCilck更丰富,比如判断触摸的状态(比如按下,或者放开),和得到点击的位置等等3.当对一个控件触摸的时候touch 先调用, onclick是 对 touch 的一个扩展实现 2.imagebutton的src和background有什么区别呢? 专业回答 2013-07-23 09:43

php URL解析函数parse_str和parse_url的区别

php parse_str函数将查询字符串解析到变量中,parse_url函数用于解析整个URL,并返回其组成部分.本文章向大家介绍这两个函数在解析URL时的使用方法和区别. php parse_str函数 php parse_str函数将查询字符串解析到变量中. parse_str函数有两个参数,第一个参数为需要解析的查询字符串并且是必须的,第二个参数用于设置接收解析查询字符串的变量,第二个参数是可选的.请看下面实例: 这里我们使用了parse_url来获取URL的查询字符串,parse_ur

&lt;link&gt;和@import url()引入外部css文件的区别

<link>和@import url()引入外部css文件的区别:标题中的两种方式都可以引入外部css文件,关于它们的基本用法这里就不多介绍了,具体可以参阅相关阅读.相关阅读:(1).<link>标签可以参阅HTML的<link>标签一章节.(2)[email protected] url()可以参阅css的@import url用法简单介绍一章节.下面介绍一下这两者的比较明显的区别.(1).加载机制不同,link方式是首先加载完css文件,然后再加载页面,而@impo

C++成员函数实现在类定义中与在类定义外的区别(Windows下直接使用g++)

在上篇文章<inline的另一用处>中,提到函数实现在类定义中与类定义外的区别. 现在先看个实验: a.cpp: [cpp] view plain copy #ifndef TEST_H #define TEST_H class A{ public: int fun(int x){ return (x*x+1000); } }; #endif void tt() { } b.cpp: [cpp] view plain copy class A{ public: int fun(int x);

URL转发和301重定向的区别

URL转发和301重定向区别是什么?URL转发和301重定向对于搜索引擎和权重转移都一样吗?下面我们一起来分析下: 一.从用户体验角度分析 在用户角度上,URL转发和301重定向完全是一样的,没有任何区别. 二.从操作使用URL转发和301重定向角度分析 URL转发操作起来更加容易,而301重定向在IIS服务器上相对比较麻烦,而且虚拟主机用户无法操作,apache服务器也比较容易实现. 三.从搜索引擎爬行和权重转移角度分析 URL转发没有权重转移,所以对于权重转移的站点没有任何帮助,如果你的站点