路径 | 相对路径 VS 绝对路径

相对路径和绝对路径


相对路径: 定位于当前文件位置访问其他资源

绝对路径: 定位于盘符项目根目录访问其他资源

前言

在web中,Linux,或者本地电脑中,会时常遇到路径,,文件,目录这些问题

如 ,写HML会遇到引用文件,图片,这时候,路径就比较重要,选用相对路径还是绝对路径,如何配置,理解?

文件是什么?

  • 储存信息的载体,信息包括(图片,文字,图像,视频,音频等)
  • 计算机文件是以计算机硬盘为载体存储在计算机上的信息集合。
  • 文件包括 :文本文档,图片,程序等
  • 文件通常具有三个字母的文件扩展名,用于指示文件类型(例如,图片文件常常以. JPEG, 格式保存并且文件扩展名为.jpg)。

也就是说,文件一般是有扩展名

.txt,.md,.doc,.pptx,.png,.html

文件夹是什么?

  • 装文件或文件夹的容器
image-20210221023306097

如下图,一个个就是文件夹

image-20210221023406290

文件夹里面可以有 文件 和 文件夹

目录是什么?

  • 目录就是文件夹下的内容清单

如要描述 C:Windows下的内容,就可以说 ,C:windows目录的内容

文件夹和目录本质是一个东西,只不过目录侧重内容展示

如下图

image-20210221023755234

可以说 C:windows文件夹下有addins文件夹,可以说C:windows目录中有addins文件夹

根是什么?

如果是电脑文件系统,根一般是指的 磁盘,如C,D,E

使用路径的目的是定位 所需资源

正确使用绝对路径和相对路径

【案例】

                   +---->css
                   |
    +-->web_project+---->js
test|              |
    |              +---->images
    +-->demo.jpg   |
                   +---->index.html

假设,有 index.html文件,需要访问外部资源demo.jpg

js,css,images,index.html文件或文件夹都在web_project目录中,或者说在web_project文件夹下

使用 绝对路径 就是从 盘符,根据目录结构定位到所需文件即可

使用 相对路径 是 ../demo.jpg ,或者 ../../test/demo.jpg

相对路径相关符号表示:

符号 说明
/ 表示目录分隔符,或者网站,根目录
../ 表示上级目录
./ 表示当前目录 (可省略)
~/ 表示用户home目录(Linux文件系统)

【案例】

          +---->css
          |
web_projec+---->js
          |
          +--->img+---->demo.jpg
          |
          +---->index.html
 

同样,index.html要访问 demo.jpg

可选方式

1、 ./img/demo,jpg

2、../web_project/img/demo.jpg

显然第二种,多此一举

总结,使用绝对路径访问资源有两步

1、进入到资源所在目录 (相邻访问或者多此一举访问)

2、访问资源

./img表示进入了 demo.jpg的所在目录中

demo.jpg表示访问资源

合起来就是 ./img/demo.jpg

再简洁省略./就是 img/demo.jpg


绝对路径的局限性 : 不灵活 ,缺点是换设备会出现路径找不到问题

问题 : 为什么自己在本地编好的页面,本地计算机预览效果正常,可以上传到服务器,就预览失败呢?

因为可能本地引入的方式是绝对路径,所表示的根是项目的根,本地计算机中表示的根也是项目的根,所以正常预览

但是,到了服务器,此时的根就可能不是项目的根,而是服务器的根,自然有出入,预览不了

来源: 博客园
作者: 茶哩哩
文章: 转载请注明原文链接:https://www.cnblogs.com/martin-1/p/14224305.html

原文地址:https://www.cnblogs.com/martin-1/p/14224305.html