相对路径规范总结

前言

        最近在学习时总是分不清相对路径到底相对哪里，并且发现在写python代码时打开文件里的相对路径和写前端css页面时的相对路径不同，让我更加混淆，故进行总结。

1 基础知识

• "../"：表示父级目录也就是去到上一级目录
• "./"：表示当前目录
• "/"：表示网站的根目录，也就是服务器www目录
• 直接写文件名，和./的效果相同

2 结论

2.1 前端语言的相对路径

• HTML文件和JS文件中出现的相对路径，都是从HTML文件所在位置开始计算的。
• CSS文件中出现的相对路径，是从CSS文件所在位置开始计算的。

2.2 编程语言的相对路径

        相对路径是指相对于当前的工作目录（工作目录！！）。如果不确定也可以用下面的python语句输出当前的工作目录。

import os
print(os.getcwd())

3 举例

3.1 前端相对路径

        如下图所示，我需要在HTML代码中导入第二个js文件夹中的bootstrap.js文件（图一的重颜色部分）。HTML文件在bootstrap-dist文件夹中（图二的重颜色部分）。故相对路径是相对于HTML的父目录开始计算，也就是bootstrap-dist文件夹。

        所以这是正确的导入格式（从html的父目录之后开始算）。

3.2 编程语言的相对路径

        在plugins下创建一个python文件仍然打开上面提到的bootstrap.js文件。python文件位置如下图所示。

        1.当在vscode中打开这个项目并读取文件时，输入的相对路径如下。

import os

print("当前的工作目录是：",os.getcwd())

try:
    f = open("BootStrap-Study/plugins/bootstrap-dist/js/bootstrap.js",'r')
    #f = open("1.py",'r')
except IOError:
    print("打开失败")
else:
    print("打开成功")
    f.close()

         输出的结果如图所示，工作目录是这个项目文件夹的位置。

        2.当在pycharm中打开这个项目并读取文件时（这是同一个项目，用不同的IDE打开），输入的相对路径如下。

import os

print("当前的工作目录是：",os.getcwd())

try:
    # f = open("BootStrap-Study/plugins/bootstrap-dist/js/bootstrap.js",'r')
    f = open("bootstrap-dist/js/bootstrap.js",'r')
except IOError:
    print("打开失败")
else:
    print("打开成功")
    f.close()

        输出的结果如图所示，工作目录是当前文件的父目录。

        3.总结：相对路径是相对于工作目录而言的，不同的IDE工作目录可能不同，也可以通过os.chdir()方法修改工作目录。