解析url中的#、&、？的作用和意义

￡神魔★判官ぃ 2022-05-08 11:14 325阅读 0赞

twitter改版，一个显著变化，就是URL加入了"\#!"符号。比如，改版前的用户主页网址为

http://twitter.com/username

改版后，就变成了

http://twitter.com/#!/username

这是主流网站第一次将"\#"大规模用于重要URL中。这表明井号（Hash）的作用正在被重新认识。

## 一、\#的涵义 ##

\#代表网页中的一个位置。其右面的字符，就是该位置的标识符。比如，

http://www.example.com/index.html#print

就代表网页index.html的print位置。浏览器读取这个URL后，会自动将print位置滚动至可视区域。

为网页位置指定标识符，有两个方法。一是使用锚点，比如`<a name="print"></a>`，二是使用id属性，比如`<div id="print">`。

## 二、HTTP请求不包括 ##

\#是用来指导浏览器动作的，对服务器端完全无用。所以，HTTP请求中不包括\#。

比如，访问下面的网址，

http://www.example.com/index.html#print

浏览器实际发出的请求是这样的：

GET /index.html HTTP/1.1
    
    Host: www.example.com

可以看到，只是请求index.html，根本没有"\#print"的部分。

## 三、\#后的字符 ##

在第一个\#后面出现的任何字符，都会被浏览器解读为位置标识符。这意味着，这些字符都不会被发送到服务器端。

比如下面URL的原意是指定一个颜色值：

http://www.example.com/?color=#fff

但是，浏览器实际发出的请求是：

GET /?color= HTTP/1.1
    
    Host: www.example.com

可以看到，"\#fff"被省略了。只有将\#转码为\#，浏览器才会将其作为实义字符处理。也就是说，上面的网址应该被写成：

http://example.com/?color=#fff

## 四、改变\#不触发网页重载 ##

单单改变\#后的部分，浏览器只会滚动到相应位置，不会重新加载网页。

比如，从

http://www.example.com/index.html#location1

改成

http://www.example.com/index.html#location2

浏览器不会重新向服务器请求index.html。

## 五、改变\#会改变浏览器的访问历史 ##

每一次改变\#后的部分，都会在浏览器的访问历史中增加一个记录，使用"后退"按钮，就可以回到上一个位置。

这对于ajax应用程序特别有用，可以用不同的\#值，表示不同的访问状态，然后向用户给出可以访问某个状态的链接。

值得注意的是，上述规则对IE 6和IE 7不成立，它们不会因为\#的改变而增加历史记录。

## 六、window.location.hash读取\#值 ##

window.location.hash这个属性可读可写。读取时，可以用来判断网页状态是否改变；写入时，则会在不重载网页的前提下，创造一条访问历史记录。

## 七、onhashchange事件 ##

这是一个HTML 5新增的事件，当\#值发生变化时，就会触发这个事件。IE8+、Firefox 3.6+、Chrome 5+、Safari 4.0+支持该事件。

它的使用方法有三种：

window.onhashchange = func;
    
    <body onhashchange="func();">
    
    window.addEventListener("hashchange"， func, false);

对于不支持onhashchange的浏览器，可以用setInterval监控location.hash的变化。

## 八、Google抓取\#的机制 ##

默认情况下，Google的网络蜘蛛忽视URL的\#部分。

但是，Google还规定，如果你希望Ajax生成的内容被浏览引擎读取，那么URL中可以使用"\#!"，Google会自动将其后面的内容转成查询字符串\_escaped\_fragment\_的值。

比如，Google发现新版twitter的URL如下：

[http://twitter.com/\#!/username][http_twitter.com_username]

就会自动抓取另一个URL：

http://twitter.com/?_escaped_fragment_=/username

通过这种机制，Google就可以索引动态的Ajax内容。

## 2. ？ ##

1）连接作用：比如

http://www.xxx.com/Show.asp?id=77&nameid=2905210001&page=1

2）清除缓存：比如

http://www.xxxxx.com/index.html 
    http://www.xxxxx.com/index.html?test123123

两个url打开的页面一样，但是后面这个有问号，说明不调用缓存的内容，而认为是一个新地址，重新读取。

## 3. & ##

不同参数的间隔符

[http_twitter.com_username]: http://twitter.com/#!/username

发表评论取消回复

表情：

评论列表（有 0 条评论，325人围观）

还没有评论，来说两句吧...

相关阅读

相关 java接口的作用和意义

一、什么是接口 Java接口是一系列方法的声明，是一些方法特征的集合，一个接口只有方法的特征没有方法的实现，因此这些方法可以在不同的地方被不同的类实现，而这些实现可以具有不

末蓝、/ 2024年04月06日 12:01/ 0 赞/ 84 阅读

相关 URL中“#” “？” &“”号的作用

阅读目录 [1. \][1.] [2. ？][2.] [3. &][3.] [回到顶部][Link 1] 1. \ 10年9月，twit

怼烎@/ 2022年07月21日 12:25/ 0 赞/ 193 阅读

相关 URL中“#” “？” &“”号的作用

[http://www.cnblogs.com/kaituorensheng/p/3776527.html][http_www.cnblogs.com_kaituorensh

我就是我/ 2022年06月16日 09:42/ 0 赞/ 169 阅读

相关 URL中“#”号的作用

1. `` 10年9月，twitter改版。一个显著变化，就是URL加入了"!"符号。比如，改版前的用户主页网址为http://twitter.com/usern

忘是亡心i/ 2022年06月03日 04:22/ 0 赞/ 195 阅读

相关 URL中 # (井号)的作用

1、井号在URL中指定的是页面中的一个位置井号作为页面定位符出现在URL中，比如：http：//localhost:8080/home/index.html\scrolle

小灰灰/ 2022年05月31日 00:36/ 0 赞/ 262 阅读

相关解析url中的#、&、？的作用和意义

twitter改版，一个显著变化，就是URL加入了"\!"符号。比如，改版前的用户主页网址为 http://twitter.com/username 改版后，就变成

￡神魔★判官ぃ/ 2022年05月08日 11:14/ 0 赞/ 326 阅读

相关泛型的意义和作用是啥？

简单的说，意义和作用有：类型的参数化，就是可以把类型像方法的参数那样传递。这一点意义非凡。泛型使编译器可以在编译期间对类型进行检查以提高类型安全，减少运行时由于对象类型

雨点打透心脏的1/2处/ 2022年01月22日 05:25/ 0 赞/ 201 阅读

相关 name的意义与作用

首先定义了一个test.py的文件，然后再定义一个函数，并在函数定义后直接运行： test.py def HaveFun(): 　　 if \_\_name

痛定思痛。/ 2021年12月14日 13:07/ 0 赞/ 280 阅读

相关 IDEA中的.iml文件和.idea文件夹作用和意义

.iml文件 idea 对module 配置信息之意， infomation of module iml是 intellij idea的工程配置文件，里面是当前pro

忘是亡心i/ 2021年11月02日 15:36/ 0 赞/ 644 阅读

相关 URL中井号的作用

　　URL中的井号(\)是比较常见的，它并不影响网址的指向，而是有众多功能和特点的。下面就为大家介绍一些有关井号的故事。　　1、页面中的某一个位置可以用井号在URL中指定

Myth丶恋晨/ 2021年10月23日 11:17/ 0 赞/ 504 阅读