Difference between relative path and absolute path (often asked in interview)

Like your C There is a folder called ABC, There are two files under the folder file1 and file2

     If you let the file file1 Say file file2 The location of ( That's the path ), So there are two ways to express it :
     The first one is ：C:\ABC\file2  This is the absolute path , To specify file2 The file in C disc ABC Under the document , From the largest Directory C The dish began to show .
     The second kind ：file2  This is the relative path , because file1 Document and file2 All documents are in C:\ABC Next , So they're in front of the path "C:\ABC" Is the same , You don't have to show it .

     ad locum , Some friends may ask , If file1 and file2 Not in the same folder , How should relative paths be represented . such as ：

    file1 The location of the for :C:\ABC\path1\file1;

    file2 The location of the for C:\ABC\path2\file2;

     Now let's file1 Give voice file2 The position of is ：../path2/file2; Two points （..） It means to go back one layer . Explain that ,file1 stay path1 Under the folder , First of all , Back to ABC Under the folder , And then add path2/file2, That is to say ../path2/file2, This is the relative path .

     Notice here ： Different operating systems use different slashes （Linux System is /,window System is \; Know that you can ）


     Sometimes when doing development , The picture is always sent to the server ,css Style sheet failure and other errors . In this case, it is mostly because you use the wrong path , Absolute paths are used where relative paths should be used , As a result, the browser cannot open the specified file in the specified location .

       Now let's talk about the difference between relative path and absolute path, which is the most troublesome for beginners .

What is the absolute path ：
Everybody knows , When we usually use the computer, we must know the location of the file to find the file we need , And the way to represent the location of the file is the path , For example, as long as you see this path ：c:/website/img/photo.jpg We knew photo.jpg File is in c Discoid website In the catalog img Subdirectory . Like this, the path that completely describes the file location is the absolute path . We do not need to know any other information to determine the location of the file according to the absolute path . In the website, it is similar to http://www.pckings.net/img/photo.jpg The way to determine the file location is also the absolute path .

     in addition , In the application of website , Usually we use "/" To represent the root directory ,/img/photo.jpg It means photo.jpg The file is in the root directory of this website img Directory . But using it this way is risky for beginners , Because you should know that the root directory referred to here is not the root directory of your website , It's the root directory of the server where your website is located , Therefore, when the root directory of the website is different from the root directory of the server , There will be errors .

What is the relative path ：
Let's first analyze why the picture can't be displayed normally . For example , Now there's a page index.htm, A picture needs to be displayed on this page photo.jpg. Their absolute path is as follows ：
c:/website/index.htm
c:/website/img/photo.jpg

     If you use absolute path c:/website/img/photo.jpg, Then everything will be normal on your computer , Because it can be in the specified position, that is c:/website/img/photo.jpg Found on the photo.jpg file , But when you upload the page to the website, you are likely to make mistakes , Because your website may be on the server c disc , May be in d disc , Or maybe aa Under the table of contents , More likely in bb Under the table of contents , In short, there is no reason to c:/website/img/photo.jpg Such a path . that , stay index.htm What kind of path to use in the file to locate photo.jpg What about the documents ？ Yes , It should be a relative path , The so-called relative path , As the name suggests, it is the position of oneself relative to the goal . In the example above index.htm To be joined in photo.jpg have access to img/photo.jpg To locate the file , So wherever you put these files , As long as their relative relationship doesn't change , You can't go wrong .

     In addition, we use “../” To represent a higher level directory ,“../../” Indicates the directory of the superior , And so on .（ Have studied Linux Your friends may be easier to understand ）

     Let's look at a few more examples , Note that in all examples index.htm There is a picture in the file photo.jpg.

example 1：
c:/website/web/index.htm
c:/website/img/photo.jpg
In this case index.htm Connected in photo.jpg How should it be expressed ？
Wrong writing ：img/photo.jpg
This kind of writing is not correct , In this case , about index.htm The file is img/photo.jpg The absolute path represented is ：c:/website/web/img/photo.jpg, Obviously not meeting the requirements .
Write it correctly ： Use …/img/photo.jpg Relative path to locate the file

example 2：
c:/website/web/xz/index.htm
c:/website/img/images/photo.jpg
In this case index.htm Connected in photo.jpg How should it be expressed ？
Wrong writing ：…/img/images/photo.jpg
This kind of writing is not correct , In this case, for index.htm The file is …/img/images/photo.jpg The absolute path represented is ：c:/website/web/img/images/photo.jpg.
Write it correctly ： have access to …/…/img/images/photo.jpg Relative path to locate the file

example 3：
c:/website/web/xz/index.htm
c:/website/web/img/photo.jpg
In this case index.htm Connected in photo.jpg How should it be expressed ？
Wrong writing ：…/…/img/photo.jpg
This kind of writing is not correct , In this case, for index.htm The file is …/…/img/photo.jpg The absolute path represented is ：c:/website/img/photo.jpg.
Write it correctly ： have access to …/img/photo.jpg Relative path to locate the file

     Through the above examples, we can find , When converting an absolute path to a relative path , The same part of the absolute path of both files can be ignored , Don't think about it . Just consider their differences . In a word , First, use a little bit to back up to the same directory , Then you're looking for another file .

summary ：
../ It's kind of like cd .. command Go back to the previous level
We need to fill in the catalogue of our pictures one by one
Be careful /*/* It's the absolute path
*/ * Look down in the directory where the current file is located
Absolute path , The path from the root directory to a directory ;
Relative paths , The path from one directory to another .

for example ：
┍ A Folder
C -|
┕ B Folder

Absolute path ： C:\A Folder

Relative paths （ If you are in the A Folder when ）： …\B Folder （‘…\’ Up one level means ）