URL地址中的#
1、#的涵义
代表网页中的一个位置。井号后面的字符,就是该位置的标识符。比如,
http://www.baidu.com/index.html#one
就代表网页index.html的one位置。浏览器读取这个URL后,会自动滚动one的位置。
怎么为网页位置指定标识符,有两种方法。一是使用锚点,比如,
或者使用id属性,比如
2、HTTP请求不包括#
是用来指导浏览器动作的,对服务器端完全无用。
比如,访问下面的网址
http://www.baidu.com/index.html#one
浏览器实际发出的请求时这样的:
GET /index.html HTTP/1.1
Host:www.baidu.com
可以看到,只是请求index.html,根据没有"#one"的部分。
3、#后的字符
在第一个#后面出现的任何字符,都会被浏览器读为位置标识符。这意味着,这些字符都不会被发送到服务器端。
比如:下面URL的原意是制定一个颜色值:
http://www.baidu.com/?color=#fff
但是,浏览器实际发出的请求时:
GET /?color= HTTP/1.1
Host: www.baidu.com
可以看到,"#fff"被省略了。只有将#转码为%23,浏览器才会将其作为
实义字符处理。也就是说,上面的网址应该被写成:
http://www.baidu.com/?color=%23fff
4、改变#不触发网页重载
单单改变#后的部分,浏览器只会滚动到相应的位置,不会重新加载网页。
比如:从
http:www.baidu.com/index.html#one
改成http://www.baidu.com/index.html#two
浏览器不会重新向服务器请求index.html。
5、改变#会改变浏览器的访问历史
每一次改变#后的部分,都会在浏览器的访问历史中增加一个。
使用"后退"按钮,就可以回到上一个位置。
这对于ajax应用程序特别有用,可以用不同的#值,表示不同的访问状态,然后向
用户给出可以访问某个状态的连接。
值得注意的是,上述规则对IE6和IE7不成立,他们不会因为#的改变而增加历史。
6、window.location.hash读取#的值
window.location.hash这个属性可读可写。读取时,可以用来判断网页状态是否改变;
写入时,则会在不重载网页的前提下,创造访问历史。
7、onhashchange事件
这是一个HTML 5新增的事件,当#hash发生变化时,就会触发这个事件,IE8+、Firefox3.6+、Chrome 5+、Safari 4.0+支持
该事件。
它的使用方法有三种:
window.onhashchange = func;
window.addEventListener("hashChange",func, false);
8、Google抓取#的机制
默认情况下,Google的网络蜘蛛忽视URI的#部分。
但是,Google还规定,如果你希望ajax生成的内容被浏览器引擎读取,那么URL中可以使用
"#!",Google 会自动将其后面的内容转化成查询字符串,_esacped_fragment_的值
比如,Google发现新版Twitter的url如下:
http://www.twitter.com/#!/username
就会自动抓取另一个URL
http://www.twitter.com/?_esacped_fragment_=/username
通过这种机制,Google就可以索引动态的ajax内容。
URL地址中的#的更多相关文章
- URL地址中使用中文作为的参数【转】
原文:http://blog.csdn.net/blueheart20/article/details/43766713 引言: 在Restful类的服务设计中,经常会碰到需要在URL地址中使用中文作 ...
- 去除magento多店铺URL地址中的“___from_store=”
magento 的多店铺功能,大多数情况下是根据语言来进行选择的,当添加了多店铺之后,一般情况下我们会选择开启添加store code到url地址中. Magento 自带的这种功能算是比较不错了,但 ...
- 解决URL地址中的中文乱码问题的办法
解决URL地址中的中文乱码问题的办法 引言: 在Restful类的服务设计中,经常会碰到需要在URL地址中使用中文作为的参数的情况,这种情况下,一般都需要正确的设置和编码中文字符信息.乱码问题就此产生 ...
- URL地址中中文乱码详解(javascript中encodeURI和decodeURI方法、java.net.URLDecoder.encode、java.net.URLDecoder.decode)
引言: 在Restful类的服务设计中,经常会碰到需要在URL地址中使用中文作为的参数的情况,这种情况下,一般都需要正确的设置和编码中文字符信息.乱码问题就此产生了,该如何解决呢?且听本文详细道来. ...
- JS动态获取项目名以及获取URL地址中的参数
在项目当中我们可能会遇到例如改变的项目名称之后,相对应的地址就需要改变,为了减少工作量,将地址当中的项目名这一块写成动态获取的,那么最关键一点就是我要先获取它,再进行操作: 知识点整理,话不多说,直接 ...
- 【面试题】如何去掉vue的url地址中的#号?及其原理?
如何去掉vue的url地址中的#号?及其原理? 点击打开视频讲解更加详细 如何去掉vue的url地址中的#号? import Vue from 'vue'; import VueRouter from ...
- JavaScript------获取url地址中的参数
$(document).ready(function () { //获取地址中的参数(name是字符串) function getParameter(name) { //正则表达式 var reg = ...
- URL地址中的转义符
如果在XML里面存储URL地址可能涉及到转义符的问题 WEB开发中通过问号(?)方式在浏览器地址栏中传值时.浏览器是通过“&”来区分问号后的参数个数的. 如果出现传值参数中带有“&”时 ...
- 获取Url地址中参数的3种方法【华为云技术分享】
获取Url的代码如下:window.location.href; 方法一:原生js(假设已经获得了Url地址) var url = 'https://gitbook.cn/gitchat/geekbo ...
- ipv6地址在URL中的表达方式,如何在URL地址中包含ipv6地址
摘要 本文档定义了在WWW浏览器的URL中执行的文本IPv6地址的格式.在包括Microsoft的IE,Mozilla和Lynx等几个已经被广泛安装使用的浏览器的IPv6版本中,这种格式已经被使用.并 ...
随机推荐
- Socket网络编程--网络爬虫(2)
上一小节,我们实现了下载一个网页.接下来的一步就是使用提取有用的信息.如何提取呢?一个比较好用和常见的方法就是使用正则表达式来提取的.想一想我们要做个什么样的网络爬虫好呢?我记得以前好像博客园里面有人 ...
- Fluent动网格【6】:部件变形案例
本案例描述使用动网格过程中处理边界变形的问题. 案例描述 本案例几何为一个抛物线旋转成型的几何体.如图所示. 其中上壁面刚体运动引起抛物面变形.刚体运动方程为: \[ v=\left\{ \begin ...
- [转]Unity手游之路<十二>手游资源热更新策略探讨
最近梳理了下游戏流程.恩,本来想写下,但是,还是看前辈的吧 版权声明: https://blog.csdn.net/janeky/article/details/17666409 上一次我们学习了如何 ...
- Python3多线程之间的执行顺序问题
[本文出自天外归云的博客园] 一个多线程的题:定义三个线程ID分别为ABC,每个线程打印10遍自己的线程ID,按ABCABC……的顺序进行打印输出. 我的解法: from threading impo ...
- 基于Python, Selenium, Phantomjs无头浏览器访问页面
引言: 在自动化测试以及爬虫领域,无头浏览器的应用场景非常广泛,本文将梳理其中的若干概念和思路,并基于代码示例其中的若干使用技巧. 1. 无头浏览器 通常大家在在打开网页的工具就是浏览器,通过界面上输 ...
- 【WPF】ListBox GridViewColumn Header 文字换行、文字多行显示
ListBox GridViewColumn Header 文字换行.文字多行显示,在Header中需要换行的地方写 <GridViewColumn Header="空间另存 为总量& ...
- InstallShield:卸载时文字叠加,文字乱码
问题: InstallShield2010打包的程序.如果程序正在运行,卸载程序,提示关闭程序,然后消息界面出现文字叠加. 定位问题: 新建Installshield项目,依次修改SetupType, ...
- Java知多少(45)未被捕获的异常
在你学习在程序中处理异常之前,看一看如果你不处理它们会有什么情况发生是很有好处的.下面的小程序包括一个故意导致被零除错误的表达式. class Exc0 { public static void ma ...
- [React] 02 - Intro: why react and its design pattern
为啥使用React,给我个理由 过去 需要手动更新DOM.费力地记录每一个状态:既不具备扩展性,又很难加入新的功能,就算可以,也是有着冒着很大的风险. 不过,使用这种开发方式很难打造出极佳的用户体验. ...
- windows系统下,express构建的node项目中,如何用debug控制调试日志
debug是一款控制日志输出的库,可以在开发调试环境下打开日志输出,生产环境下关闭日志输出.这样比console.log方便多了,console.log只有注释掉才能不输出. debug库还可以根据d ...