URL中“#” “?” &“”号的作用浅析

1. #

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

  这是主流网站第一次将"#"大规模用于重要URL中。这表明井号(Hash)的作用正在被重新认识。本文根据HttpWatch的文章,整理与井号有关的所有重要知识点。

一、#的涵义

  #代表网页中的一个位置。其右面的字符,就是该位置的标识符。比如,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

三、#后的字符

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

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

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

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

比如,从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

  就会自动抓取另一个URL:http://twitter.com/?_escaped_fragment_=/username

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

AJAX = 异步 JavaScript和XML(标准通用标记语言的子集)。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. &

不同参数的间隔符

以上所述是小编给大家介绍的URL中“#” “?” &“”号的作用浅析,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对我们网站的支持!

(0)

相关推荐

  • PHP curl CURLOPT_RETURNTRANSFER参数的作用使用实例

    获取页面内容,不直接输出到页面,CURLOPT_RETURNTRANSFER参数设置 使用PHP curl获取页面内容或提交数据,有时候希望返回的内容作为变量储存,而不是直接输出.这个时候就必需设置curl的CURLOPT_RETURNTRANSFER选项为1或true. 1.curl获取页面内容, 直接输出例子: 复制代码 代码如下: <?php $url = 'http://www.jb51.net'; $ch = curl_init(); curl_setopt($ch, CURLOPT_

  • URL中井号的作用介绍

    URL中的井号(#)是比较常见的,它并不影响网址的指向,而是有众多功能和特点的.下面就为大家介绍一些有关井号的故事. 1.页面中的某一个位置可以用井号在URL中指定 井号作为比较长出现在URL的一种符号,通常也会代表这个页面中的某一个位置,比如:http://aoshu.juren.com/chzt/xiaoxueshijuan/index.html#nn1,此URL表示在这个页面中nn1的位置.浏览器读取这个URL后,会自动将nn1位置滚动至可视区域. 设置描点只需在相应位置添加,然后在按钮的

  • URL中“#” “?” &“”号的作用浅析

    1. # 10年9月,twitter改版.一个显著变化,就是URL加入了"#!"符号.比如,改版前的用户主页网址为http://twitter.com/username改版后,就变成了http://twitter.com/#!/username 这是主流网站第一次将"#"大规模用于重要URL中.这表明井号(Hash)的作用正在被重新认识.本文根据HttpWatch的文章,整理与井号有关的所有重要知识点. 一.#的涵义 #代表网页中的一个位置.其右面的字符,就是该位置

  • Angular2+如何去除url中的#号详解

    前言 本文中主要介绍了关于Angular2+中去除url中#号的相关内容,这是最近在工作中遇到的一个问题,觉着有必要给大家分享下,下面话不多说了,来一起看看详细的介绍吧. 1. 为什么要去除? Angular官方指出:如果没有足够使用hash风格(#)的理由,还是尽量使用HTML5模式的路由风格: 如果配置了hash风格,在微信支付或是Angular的深路径依然会出404的问题: 当你需要使用GA等工具时,由于无法获取#号后的URL,导致每次路由切换都给其发送一个路径: '#'有点丑. 2. 怎

  • Angular.JS去掉访问路径URL中的#号详解

    本文目录 URL的#号问题 找到错误原因 静态网站的解决方案 动态网站的解决方案 一. URL的#号问题 使用AngularJS的朋友都应该了解,AngularJS框架定义了自己的前端路由控制器,通过不同URL实现单面(ng-app)对视图(ng-view)的部署刷新,并支持HTML5的历史记录功能,详细介绍可以参考文章:AngularJS路由和模板. 对于默认的情况,是不启动HTML5模式的,URL中会包括一个#号,用来区别是AngularJS管理的路径还是WebServer管理的路径. 比如

  • C++中双冒号::的作用浅析

    C++中经常使用的作用符::,作用如下: •作用域限定符.在类体内申明函数,并在类体外定义函数时,必须在定义函数时加上类名和作用域限定符. class MyClass{ public: int num; int fun();//类体内申明函数 }; //类体外定义函数 int MyClass::fun(){ return 1; } •静态数据和静态成员函数成员既可以通过对象名引用,也可以通过类名加::来引用.例如,MyClass::a.静态成员函数的目的就是为了操作静态数据成员,静态成员函数引用

  • 浅析JS获取url中的参数实例代码

    js获取url中的参数代码如下所示,代码简单易懂,附有注释,写的不好还请见谅! function UrlSearch() { var name, value; var str = location.href; //取得整个地址栏 var num = str.indexOf("?") str = str.substr(num + 1); //取得所有参数 stringvar.substr(start [, length ] var arr = str.split("&&

  • 解决URL中含有-与号-不符合标准问题

    今天在网站重构时,遇到了这个问题,URL需要传递两个变量(abc.asp?type=xxx&id=xxx),可是加了"&"后不能通过W3C检验,搜索了一番没有找到结果,只好去查英文网站查了下,用"& a m p;"代替"&"就可以解决这个问题了.abc.asp?type=xxx& a m p;id=xxx简单的翻译了下不能通过检验的原因[:)英文能力有限]是因为Netscape的3.x版本不兼容这个标记.只

  • 基于网址URL中特殊字符转义编码

    目录 网址URL中特殊字符转义编码 URL特殊字符转义,URL中一些字符的特殊含义,基本编码规则如下: 如果需要在URL中用到,需要将这些特殊字符换成相应的十六进制的值 预备知识 为什么需要Url编码 哪些字符需要编码 US-ASCII字符集中没有对应的可打印字符 保留字符 不安全字符 如何对Url中的非法字符进行编码 Javascript中的escape,encodeURI和encodeURIComponent的区别 安全字符不同 兼容性不同 对Unicode字符的编码方式不同 适用场合不同

  • 移除AngularJS下URL中的#字符的方法

    AngularJS 默认将会使用一个 # 号来对URL进行路由. 例如: http://example.com/ http://example.com/#/about http://example.com/#/contact 要获得干净的URL并将井号从URL中移除是很容易的. 完成两件事情就行了. 配置 $locationProvider 设置我们的相对连接的起点路径 $location 服务 在Angular中, $location服务会解析地址栏中的URL,并对你的应用程序作出改变,反之亦

  • URL中允许携带sessionid带来的安全隐患分析

    图示: 下图是从测试组发来的安全报告中剪出来的,图有些小问题,本来想重画1个,在visio中没找到合适的图.所以只能用别人的图了. 说明: 让我们对上图的步骤进行详细说明: 1. 黑客用自己的帐号登录,假设登录页面是:http://www.abc.com/login.jsp 2. 服务器返回登录成功. 3. 黑客从cookie中查看自己的sessionid,比如是1234 4. 黑客把带自己sessionid的地址发送给一般用户.http://www.abc.com/login.jsp;jses

随机推荐