URL(Uniform Resource Locator)

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

结构

基本URL包含模式(或称协议)、服务器名称(或IP地址)、路径和文件名,如“协议://授权/路径?查询”。完整的、带有授权部分的普通统一资源标志符语法看上去如下:协议://用户名:密码@子域名.域名.顶级域名:端口号/目录/文件名.文件后缀?参数=值#标志

第一部分:

模式/协议(scheme):它告诉浏览器如何处理将要打开的文件。最常用的模式是超文本传输协议(Hypertext Transfer Protocol,缩写为HTTP),这个协议可以用来访问网络。1 其他协议如下:

  • http——超文本传输协议资源

  • https——用安全套接字层传送的超文本传输协议

  • ftp——文件传输协议

  • mailto——电子邮件地址

  • ldap——轻型目录访问协议搜索

  • file——当地电脑或网上分享的文件

  • news——Usenet新闻组

  • gopher——Gopher协议

  • telnet——Telnet协议

第二部分:

文件所在的服务器的名称或IP地址,后面是到达这个文件的路径和文件本身的名称。服务器的名称或IP地址后面有时还跟一个冒号和一个端口号。它也可以包含接触服务器必须的用户名称和密码。路径部分包含等级结构的路径定义,一般来说不同部分之间以斜线(/)分隔。询问部分一般用来传送对服务器上的数据库进行动态询问时所需要的参数。

分类

1、绝对URL

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

2、相对URL

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

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

以下为建立路径所使用的几个特殊符号,及其所代表的意义。

  • .:代表目前所在的目录,相对路径。 如:<a href="./abc">文本</a> 或 <img src="./abc" />

  • ..:代表上一层目录,相对路径。 如:<a href="../abc">文本</a> 或 <img src="../abc" />

  • ../../:代表的是上一层目录的上一层目录,相对路径。 如:<img src="../../abc" />

  • /:代表根目录,绝对路径。 如:<a href="/abc">文本</a> 或 <img src="/abc" />

  • D:/abc/:代表根目录,绝对路径。

在使用相对路径时,我们用符号“.”来表示当前目录,用符号“..”来表示当前目录的父目录。

重点: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。

转载于:https://blog.51cto.com/zdkjlin/1928324

[html] url、href、src 详解相关推荐

  1. iOS URL Schemes 使用详解 什么是 URL Schemes

    URL Schemes 使用详解 用原生 iOS 的人分两种,懂 URL Schemes 的和不懂的. 前者是「魔法师」,后者是「麻瓜」. URL Schemes 应用在 iOS 上已经很久了.对于使 ...

  2. URL编码/解码详解

    URL编码/解码详解 当 URL 路径或者查询参数中,带有中文或者特殊字符的时候,就需要对 URL 进行编码(采用十六进制编码格式).URL 编码的原则是使用安全字符去表示那些不安全的字符. 安全字符 ...

  3. 常用默认端口+URL解析+HTTP详解

    常用默认端口 http端口80 https端口443 tomcat端口8080 URL详解 http://www.aspxfans.com:8080/news/index.asp?boardID=5& ...

  4. url、href、src 详解

    URL(Uniform Resource Locator) 统一资源定位符是对可以从互联网上得到的资源的位置和访问方法的一种简洁的表示,是互联网上标准资源的地址.互联网上的每个文件都有一个唯一的URL ...

  5. url,href,src区别

    URL(Uniform Resource Locator) 统一资源定位符是对可以从互联网上得到的资源的位置和访问方法的一种简洁的表示,是互联网上标准资源的地址.互联网上的每个文件都有一个唯一的URL ...

  6. window.location获取url各项参数详解

    window.location方法后还还可以带href,search等参数,下面我们来看看获取url各项参数的办法. URL即:统一资源定位符 (Uniform Resource Locator, U ...

  7. android 百度移动搜索 url 参数,百度刷站内快排算法参数-百度搜索URL参数比较详解...

    [假如您搜索到此页面必然要打开]或者对你有辅佐,相信你必然在研究百度快速排名算法-刷点击,发包,线程,站内刷等等,下面是百度最新的参数,对快排或者有些辅佐. 新增参数(移动端) word=代表手机移动 ...

  8. python爬虫获取下一页url_Python爬虫获取页面所有URL链接过程详解

    如何获取一个页面内所有URL链接?在python中可以使用urllib对网页进行爬取,然后利用Beautiful Soup对爬取的页面进行解析,提取出所有的URL. 什么是Beautiful Soup ...

  9. python爬虫之js链接跳转抓取_Python爬虫获取页面所有URL链接过程详解

    如何获取一个页面内所有URL链接?在Python中可以使用urllib对网页进行爬取,然后利用Beautiful Soup对爬取的页面进行解析,提取出所有的URL. 什么是Beautiful Soup ...

最新文章

  1. Mozilla Labs Apps Developer Preview发布了
  2. Python Scipy 科学计算库
  3. 【深度学习】L1、L2损失 和 L1、L2正则化
  4. python 来搞定 非线性方程组和最小二乘拟合问题
  5. Photo.scr病毒
  6. IDEA/Pycharm 插件与主题切换
  7. php mail函数_php 发送邮件函数
  8. java定义私有变量_java – 为什么在类中声明变量私有?
  9. 3张报表搞定财务分析
  10. AS开发者转LAYA一周心得
  11. Linux之SDL2+OpenGL+EGL绘制(十六)
  12. js JQuery 获取元素和遍历
  13. WPF DataGrid 获取当前行某列值
  14. 【大数据部落】基于随机森林、svm、CNN机器学习的风控欺诈识别模型
  15. 针对吞吐量优化的架构
  16. ad18 bell封装_AD元件库中的常用元件和元器件封装资料合集
  17. 5分钟快速学会使用Swiper.js,实现轮播图各种效果!
  18. u盘文件突然不见了怎么样才能恢复呢?
  19. 3D模型欣赏:白发小恶魔女 次世代角色设计 毛发细腻
  20. mysql笔试题18道

热门文章

  1. MySQL介绍及安装(一)
  2. WebAPI 和 WebService的区别
  3. MySQL的索引创建、删除
  4. java中三种常见内存溢出错误的处理方法(good)
  5. 下载输入python之小说下载器version2.0
  6. 2013年5月16日星期四初始sqlserver附加数据库权限及maven和selenium
  7. SqlServer为什么自动在主键上建立聚集索引
  8. 通用的“关于本软件”对话框
  9. 从/etc/inetd.conf学习服务(4)
  10. idea 启动选择profiles_玩转SpringBoot 2 之项目启动篇