logo
搜索
我的图书馆

发文章

发文工具

其他工具

留言交流
搜索
分享

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

 安之木小屋 2021-12-31

一、URL特殊符号解析

URL无法显示某些特殊符号，这个时候就要使用编码了。编码的格式为：一个百分号，后面跟对应字符的ASCII（16进制）码值。例如，空格的编码值是”%20“。

　　URL中易出现的特殊字符：

  1. 特殊含义                                          十六进制
  3. + 表示空格（在URL中不能使用空格）                     %2B
  5. / 分隔目录和子目录                                  %2F
  7. ? 分隔实际的URL和参数                               %3F
  9. # 表示书签                                         %23
  11. & URL中指定的参数间的分隔符                          %26
  13. = URL中指定的参数的值                               %3D
  1. URL特殊字符需转义   
  3. 1、空格换成加号(+)   
  4. 2、正斜杠(/)分隔目录和子目录   
  5. 3、问号(?)分隔URL和查询   
  6. 4、百分号(%)制定特殊字符   
  7. 5、#号指定书签   
  8. 6、&号分隔参数

转义字符的原因： 

如果你的表单使用get方法提交，并且提交的参数中有“&”等特殊符的话，如果不做处理，在service端就会将&后面的作为另外一个参数来看待。例如： 
表单的action为list.jsf?act=go&state=5 
则提交时通过request.getParameter可以分别取得act和state的值。 
如果你的本意是act='go&state=5'这个字符串，那么为了在服务端拿到act的准确值，你必须对&进行转义。 

url转义字符原理： 
将这些特殊的字符转换成ASCII码，格式为：%加字符的ASCII码，即一个百分号%，后面跟对应字符的ASCII（16进制）码值。例如 空格的编码值是"%20"。 

  1. URL特殊符号及对应的十六进制值编码：
  3.  +       URL中+号表示空格                  %2B   
  4.  空格     URL中的空格可以用+号或者编码        %20   
  5.  /       分隔目录和子目录                   %2F    
  6.  ?       分隔实际的 URL 和参数              %3F    
  7.  %       指定特殊字符                      %25    
  8.  #       表示书签                         %23    
  9.  &       URL中指定的参数间的分隔符           %26    
  10.  =       URL中指定参数的值                 %3D

二、URL中#号(井号)的作用  

1. 井号在URL中指定的是页面中的一个位置

井号作为页面定位符出现在URL中，比如：http://www./features.htm#print ，此URL表示在页面features.htm中print的位置。浏览器读取这个URL后，会自动将print位置滚动至可视区域。

井号作为页面定位符出现在URL中，比如：http://www./features.htm#print ，此URL表示在页面features.htm中print的位置。浏览器读取这个URL后，会自动将print位置滚动至可视区域。

在页面上添加锚点的方法为：<a name=”print”></a>或使用<div id=”print” >。

3. 任务位于井号后面的字符都是位置标识符

不管第一个井号后面跟的是什么参数，只要是在井号后面的参数一律看成是位置标识符。

比如这样一个链接（http:///?color=#ffff&shape=circle），后面跟的参数是颜色和形状，但是服务器却并不能理解URL中的含义。服务器接收到的只是：

4. 改变井号后面的参数不会触发页面的重新加载但是会留下一个历史记录

仅改变井号后面的内容，只会使浏览器滚动到相应的位置，并不会重现加载页面。

比如从http://www./features.htm#filter到http://www./features.htm#print，浏览器并不会去重新请求页面，但是此操作会在浏览器的历史记录中添加一次记录，即你可以通过返回按钮回答上次的位置。这个特性对Ajax来说特别的有用，可以通过设置不同井号值，来表示不同的访问状态，并返回不同的内容给用户。（注：在IE6和IE7下井号的改变不会增加历史记录。）

5、可以通过javascript使用window.location.hash来改变井号后面的值

window.location.hash这个属性可以对URL中的井号参数进行修改，基于这个原理，我们可以在不重载页面的前提下创造一天新的访问记录。如标记框架页面当前的页面：

除此之外，HTML 5新增的onhashchange事件，当#值发生变化时，就会触发这个事件。

6. Googlebot对井号的过滤机制

默认情况下Google在索引页面的时候会忽略井号后面的参数，同时也不会去执行页面中的javascript。然而谷歌为了支持对Ajax生成内容的索引，定义了如果在URL中使用“#!”，则Google会自动将其后面的内容转成查询字符串_escaped_fragment_的值。

比如最新的twitter URL：http://twitter.com/#!/username，Google会自动请求http://twitter.com/?_escaped_fragment_=/username来获取Ajax内容。

 

三、URL中“#” “？” &“”号的作用

1. #

    10年9月，twitter改版。一个显著变化，就是URL加入了"#!"符号。比如，改版前的用户主页网址为http://twitter.com/username改版后，就变成了http://twitter.com/#!/username
　　这是主流网站第一次将"#"大规模用于重要URL中。这表明井号（Hash）的作用正在被重新认识。本文根据HttpWatch的文章，整理与井号有关的所有重要知识点。
（1）#的涵义
　　#代表网页中的一个位置。其右面的字符，就是该位置的标识符。比如，http://www./index.html#print就代表网页index.html的print位置。浏览器读取这个URL后，会自动将print位置滚动至可视区域。
　　为网页位置指定标识符，有两个方法。一是使用锚点，比如<a name="print"></a>，二是使用id属性，比如<div id="print">。


（2）HTTP请求不包括#
　　#是用来指导浏览器动作的，对服务器端完全无用。所以，HTTP请求中不包括#。
比如，访问下面的网址，http://www./index.html#print，浏览器实际发出的请求是这样的：

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

 

（3）#后的字符
　　在第一个#后面出现的任何字符，都会被浏览器解读为位置标识符。这意味着，这些字符都不会被发送到服务器端。
比如，下面URL的原意是指定一个颜色值：http://www./?color=#fff，但是，浏览器实际发出的请求是：

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

 　　

（4）改变#不触发网页重载
　　单单改变#后的部分，浏览器只会滚动到相应位置，不会重新加载网页。
比如，从http://www./index.html#location1改成http://www./index.html#location2，浏览器不会重新向服务器请求index.html。

 

（5）改变#会改变浏览器的访问历史
　　每一次改变#后的部分，都会在浏览器的访问历史中增加一个记录，使用"后退"按钮，就可以回到上一个位置。这对于ajax应用程序特别有用，可以用不同的#值，表示不同的访问状态，然后向用户给出可以访问某个状态的链接。值得注意的是，上述规则对IE 6和IE 7不成立，它们不会因为#的改变而增加历史记录。
　　

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

(7)onhashchange事件
　　这是一个HTML 5新增的事件，当#值发生变化时，就会触发这个事件。IE8+、Firefox 3.6+、Chrome 5+、Safari 4.0+支持该事件。
　　它的使用方法有三种：

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

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

(8)Google抓取#的机制
　　默认情况下，Google的网络蜘蛛忽视URL的#部分。
　　但是，Google还规定，如果你希望Ajax生成的内容被浏览引擎读取，那么URL中可以使用"#!"，Google会自动将其后面的内容转成查询字符串_escaped_fragment_的值。
　　比如，Google发现新版twitter的URL：http://twitter.com/#!/username
　　就会自动抓取另一个URL：http://twitter.com/?_escaped_fragment_=/username
　　通过这种机制，Google就可以索引动态的Ajax内容。

 注

AJAX = 异步 JavaScript和XML（标准通用标记语言的子集）。AJAX 是一种用于创建快速动态网页的技术。

2. ？

(1)连接作用：比如

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

(2)清除缓存：比如

http://www.xx/index.html 
http://www.xx/index.html?test123123

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

3. &

不同参数的间隔符

    本站是提供个人知识管理的网络存储空间，所有内容均由用户发布，不代表本站观点。请注意甄别内容中的联系方式、诱导购买等信息，谨防诈骗。如发现有害或侵权内容，请点击一键举报。
    转藏 分享 献花（0）

    来自： 安之木小屋 > 《待分类》

    举报/认领

    0条评论

    发表

    请遵守用户 评论公约

    类似文章 更多