HTML中相对URL的解释

JerryXia 发表于 , 阅读 (113,817)

1、真正的相对路径举个例子,假如你有一个调试用的服务器地址为"http://localhost"。其下还有几个子功能。包括http://localhost/test1/index.htmlhttp://localhost/test1/hello.html

这时就可以考虑使用相对路径了。假如在index.html页面中要链接到hello.html页面去。可以在链接标签中使用href="hello.html"就可以正确的链接过去。因为index.html页的当前的目录是/test1,所以相对于index.html的链接就转换为/test1/hello.html。

2、全局相对路径其实这一段的所谓相对路径,仅仅是指不含有主机名的路径而已。

主要特征就是在相对URL的最前面是含有"/"的。这样的路径就是以网站的根路径开始计算的。

还是第一种方法中的例子,换成全局相对路径可以写成 /test/hello.html 的形式;或者index页面想要引用 http://localhost/css/style.css,按照1的写法可以写成 <link href="../css/style.css" />,虽然还是看的懂,但总不是那么简洁。
所以可以考虑使用全局相对路径, 就可以写成这样的形式<link href="/css/style.css" />,这样是以URL的根路径开始寻找的,可以很好的找到需要的路径。

全局相对路径是一种很好的方式,可以实现在一个WEB应用的部署内部很好的链接,也不需要为了".."而晕倒。问题就是,如果一个应用的部署从"/"变成了"/app"之类的,就会出问题了。而这种情况在Tomcat等等不太适合在根路径上配置服务的服务器就比较常见了。

3、框架中的相对URL 框架中的相对URL就比较容易理解了。比如在一个框架中制定另一个框架页面需要打开的相对URL,这时这个相对URL就是基于本框架页面的。

比如左侧框架页面正在显示的页面是/hello/test.html,而右侧框架页面正在显示/hi/test.html。则在左侧框架页面的一个连接<a href="test2.html" target="XXX"></a> 在右侧框架页面打开连接的话,则是打开/hello/test2.html。

4、框架中的JavaScript的相对这个就比较恶心了,在左侧框架页面中的一个连接上使用事件来处理JS代码。JS代码中直接引用右侧框架页面对象,并指定相对URL,则这时的相对URL是基于原来的目的框架页面的。

在这种情况中是很容易与第3条相混淆的,应该注意。

这里是google的工程师在论坛里对相对路径和绝对路径的解答,我觉得不错,引用下来。

There is no "absolute" answer :-) There are pros and cons to both
absolute and relative URLs in links: Absolute URLs: + help keep the
links pointing to your content if someone were to copy it (*) + help
keep the links pointing to your domain name if you cannot select a
canonical (can't do 301 redirects) + help make sure that you're
pointing to the right URL even if you move things around (say for
stylesheets or graphics) - cannot be tested on a staging / testing
server (eg locally) (unless you insert the links dynamically) - makes
it hard to move content (unless the links are inserted dynamically)
Relative URLs: + make it easy to move content around + make it easy to
test locally and on a staging server - are easy to break if linking to
content that isn't moved as well (stylesheet, graphics, etc) - an evil
scraper would have less work (*) There's a middle ground as well,
using absolute links without a domain name, eg:
<a href="/resources/green/mostly/page.htm" ...> Personally, I prefer to
use relative URLs + some absolute (without domain name) ones to shared

  1. The advantage of being able to test things out 1:1 on a
  2. server can't compete with the pseudo- protection against
  3. The only place I would use absolute URLs would be if the
  4. is hosted somewhere where the webmaster can't do a 301 redirect

and may have trouble with duplicates. I've seen this a lot with sites
hosted on a free account with the ISP; often it will be hosted as
www.isp.com/users/~name/site ..., then perhaps
domain.com/site... and www.domain.com/site... . By using
absolute URLs in that situation, any value passed to one of the wrong
URLs will automatically pass value to the correct URLs as well. If you
have a really good CMS you may be able to change from one to another
and use a staging server without much work. In that case, it probably
doesn't matter which one is chosen. John (*) Regarding the evil
scraper scenario: I think this is overrated and those who have
problems with it usually have other problems to worry about. Also,
most scraper software recognizes absolute links and swaps them out
anyway.

添加新评论