您的位置:首页 > Web前端

前端入门知识——相对路径和绝对路径

2019-05-28 16:49 2783 查看

去一个地方,首先要明确到达此地的路径。

编程也是如此,要加载图片或者引入其他代码文件,也需要设置正确的路径。

路径分为绝对路径与相对路径:

(1).青岛李沧区重庆中路967号xxx小区17号楼2单元502,这是一个绝对路径。

(2).15号楼左手边那栋楼2单元502,这是一个相对路径。

由此得出,绝对路径是对一个位置路径完整描述,相对路径则是以某一个事物为参考描述位置。

程序中的相对路径与绝对路径也是同样的道理,下面进行一下详细介绍。

一.绝对路径:

举两个最为常见的绝对路径的例子:

(1).完整的URI地址:

http://www.softdewhy.com/antzone.jpg。

DNS服务器能够将网址解析到服务器硬盘下antzone.jpg图片文件。

(2).完整盘符:

D:\mayi\web\images\antzone.jpg。

图片的存储位置得到了完整描述,非常明确。

二.相对路径:

相对路径要比绝对路径复杂一些。

既然是相对路径,那么必须有一个参考点,下面以如下路径做一个分析:

root表示根目录,首先介绍一下路径的语法格式:

(1).(/):一个斜杠表示根目录。

(2).(./):一个点(.)后面跟一个斜杠表示当前目录,也就是当前文件所在目录。

(3).(…/):两个点(.)后跟一个斜杠表示前文件所在目录的上一级目录。

(4).(…/…/):表示当前文件所在目录的上上级目录,以此类推,不再举例。

相对路径分析实例如下:

下面所有例子都以ah-1.html文件为当前文件。

<a href="./https://blog.csdn.net/qianduanshuo/article/details/ah-2.html">兴趣部落欢迎您</a>

./表示当前目录,也就是ah-1.html文件所在的目录a,所以路径可以访问a目录下https://blog.csdn.net/qianduanshuo/article/details/ah-2.html文件。

特别说明:./可以省略,所以可以写成

<a href="a-1/a-1-1/ah-1-1-1.html">兴趣部落欢迎您</a>

可以访问当当前目录(a文件夹)/a-1文件夹/a-1-1文件夹下的ah-1-1-1.html文件。

<a href="/b/bh-1.html">兴趣部落欢迎您</a>

上述代码可以访问根目录下(root)/b文件夹下的bh-1.html文件。

特别说明:下面的例子是以ah-1-1-1.html为当前文件。

<a href="../../../b/bh-1.html">兴趣部落欢迎您</a>

代码分析如下:

(1).(…/)表示上一级目录。

(2).三个(…/)表示当前文件上一级目录的上级目录的上级目录,也就是根目录。

(3).然后再查找根目录下的b目录下的bh-1.html文件。

上面细致介绍了HTML中的相对路径与绝对路径,对于其他编程语言基本也大致如此,可能会在某些小的细节有所不同,不过并不关键,关键在于掌握原理。

最后,给大家推荐一个前端学习进阶内推交流群685910553前端资料分享),不管你在地球哪个方位,
不管你参加工作几年都欢迎你的入驻!(群内会定期免费提供一些群主收藏的免费学习书籍资料以及整理好的面试题和答案文档!)

如果您对这个文章有任何异议,那么请在文章评论处写上你的评论。

如果您觉得这个文章有意思,那么请分享并转发,或者也可以关注一下表示您对我们文章的认可与鼓励。

愿大家都能在编程这条路,越走越远。

内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: