绝对路径和相对路径的概念

路径的概念

首先我们先看看什么叫做路径吧。
字面意思就是道路,换到了计算机上,我们指的就是一个其实就是一个文件的位置用一段符号来描述。

HTML路径的分类

分类其实就两种:绝对路径和相对路径。

绝对路径的概念

绝对路径绝对路径,顾名思义,它对文件位置的描述,不需要任何的参照物

以图为例

举个例子:
想象一下你现在在某个位置(我们用平面直角坐标系上的A点来表示),你现在要去找B,你们俩的距离为2。
绝对路径与相对路径.png
想想怎么描述B的位置。
有两种方法吧。
其中一种就是直接描述B点在平面直角坐标系内的位置。
现在我们标出来B点的位置,B(2,0).
这就是绝对路径的表示方法,换作网络上,我们表示一个文件的具体位置就是用一串从头到尾不带删减的URL表示。https://cdn.eagleweb.me/eaglewebblog/2019/01/30/459054294684786/绝对路径与相对路径.png就是一个绝对路径。这时候联想一下我们之前说的有关域名的知识(有关于“域名”的一些事情),世界上的域名都是独一无二的,这点同样体现出了绝对路径的特征,倘若有两个一模一样的绝对路径,那么无疑,它们指向的就是同一个文件。
而另一种表示方式就是相对路径了

相对路径的概念

还以上图为例

我们还是以上面的图为例子,我们要说的另一种方法就是相对的描述B点的位置。
直观起见,这里的方向我们采用上北下南左西右东。
现在描述B点的位置的方法就是:B点在A点正东方向距A点2处。
这就是相对路径的特征了,它需要找一个参照物,在网络上的默认情况下,这个参照物就是你的网页现在所在的位置。

相对路径的例子。

举个例子,设想我们现在在index目录下,index目录里还有一个文件夹和一个文件,分别叫a和b.html,a文件夹下又有一个文件叫c.html,现在我想在b.html文件里引起c.html文件,请问我该怎么写?
首先绝对路径在这个情况下行不通,我们已知的条件只有以上那么一些,至于index是根目录或者是另一个目录的子目录我们就无从知晓了,这个时候我们就可以使用相对路径了。
相对路径的写法,就是以你现在的文件自身为参照物,相对地表示出另一个文件的位置。
上文的例子中,我们的相对路径就可以这么写:./a/c.html
我们将它分块来看。
./代表在当前目录下,也就代表着b.html当前存在的目录,也就是index目录。假如你不写那个点,则代表着文件所在的根目录
a/进一步指出了,当前目录下的a目录下。
c.html则确切的指出了要引起哪个文件。
我们把这句话串起来,也就是我要引起在当前目录(index目录)下的a目录下的c.html文件
可能有点难理解,没事慢慢来。

再换一种情况呢?

而再换一种情况呢,别的条件都不变,我现在想要在c.html中引起b.html,怎么做呢?
应该这么写:../b.html
还是分块来看。
../代表的是当前目录的父目录(上一级目录)(那么上文中出现的“子目录”则为下一级目录)。c.html现在位于a文件夹下吧。a文件夹的上一级目录就是index目录,对吧。
b.html则还是代表着要引起的具体文件。
串一串,这句话是我要引起的是a目录的上一级目录(index目录)下的b.html
神奇吧。

用在哪里

绝对路径和相对路径可以用在<a>标签(超链接标签,我们之后会提到)的href属性中,用来描述这个超链接的指向。还可以用在<img>标签(引入图片标签,我们也会学到)的src属性中,用来描述要引入的图像的位置。还有一些,不再一一列举了。

结语

绝对路径和相对路径我们在以后的日子里需要很频繁地使用,所以无论如何都要掌握最好自己建立文件和文件夹试试。

文章目录