window.location.hash 使用说明


Posted in Javascript onNovember 08, 2010

比如loation.href是 页面的url .但是 location.hash可以获取或设置页面的 标签值 比如http://domain/#testDemo中 咱们的location.hash 就是 #testDemo

下面引用一个 网上的demo
一个搜索版块,功能有3个:普通搜索,高级搜索,后台管理,分别指明他们各自的hash 值:#search,#advsearch,#adminboss. 在页面初始化的时候,通过window.location.hash来判断用户需要访问的页面,也就是将要显示的版块

var hash; 
hash = (!window.location.hash)?"#search":window.location.hash; 
window.location.hash = hash; 
//这里我们解释一下(!window.location.hash)什么意思?首先如果当前页面的地址栏的链接地址 不包含#....的这些的话,直接取值的话,他会为空!比如这个例子,https://3water.com/直接取 alert(window.location.hash)//""空 转化为 boolean值 为 false 
// 如果 https://3water.com#hello,world直接取 alert(window.location.hash)//#hello,world 转化为 boolean值 为 true 
//下面的就是 可以用switch判断 
//调整地址栏地址,使前进、后退按钮能使用 
switch(hash){ 
case "#search": 
show("panel1"); 
break; 
case "#advsearch": 
show("panel2"); 
break; 
case "#adminboss": 
show("panel3"); 
break; 
}

下面引用 别人的一句话:
通过window.location.hash=hash这个语句来调整地址栏的地址,使得浏览器里边的“前进”、“后退”按钮能正常使用(实质上欺骗了浏览器)。然后再根据hash值的不同来显示不同的面板(用户可以收藏对应的面板了),这就使得Ajax页面的浏览趋于传统化了。
Javascript 相关文章推荐
javascript Xml增删改查(IE下)操作实现代码
Jan 30 Javascript
javascript获取URL参数与参数值的示例代码
Dec 20 Javascript
Jquery遍历checkbox获取选中项value值的方法
Feb 13 Javascript
JavaScript数据类型检测代码分享
Jan 26 Javascript
一道常被人轻视的web前端常见面试题(JS)
Feb 15 Javascript
微信小程序 刷新上拉下拉不会断详细介绍
May 11 Javascript
MvcPager分页控件 适用于Bootstrap
Jun 03 Javascript
react+redux的升级版todoList的实现
Dec 18 Javascript
浅谈webpack 构建性能优化策略小结
Jun 13 Javascript
JavaScript设计模式之装饰者模式定义与应用示例
Jul 25 Javascript
Node.js中读取TXT文件内容fs.readFile()用法
Oct 10 Javascript
详解create-react-app 2.0版本如何启用装饰器语法
Oct 23 Javascript
JavaScript游戏之是男人就下100层代码打包
Nov 08 #Javascript
JavaScript游戏之优化篇
Nov 08 #Javascript
javascript开发中因空格引发的错误
Nov 08 #Javascript
window.ActiveXObject使用说明
Nov 08 #Javascript
发布一个基于javascript的动画类 Fx.js
Nov 05 #Javascript
微博@符号的用户名提示效果。(想@到谁?)
Nov 05 #Javascript
js focus不起作用的解决方法(主要是因为dom元素是否加载完成)
Nov 05 #Javascript
You might like
德生PL660的电路分析和打磨
2021/03/02 无线电
PHP数据类型之整数类型、浮点数的介绍
2013/04/28 PHP
php+xml结合Ajax实现点赞功能完整实例
2015/01/30 PHP
Windows2003下php5.4安装配置教程(Apache2.4)
2016/06/30 PHP
thinkphp分页实现效果
2016/10/13 PHP
php版微信小店调用api示例代码
2016/11/12 PHP
PHP递归的三种常用方式
2019/02/28 PHP
JavaScript 格式字符串的应用
2010/03/29 Javascript
THREE.JS入门教程(4)创建粒子系统
2013/01/24 Javascript
利用webqq协议使用python登录qq发消息源码参考
2013/04/08 Javascript
教你用jquery实现iframe自适应高度
2014/06/11 Javascript
js点击button按钮跳转到另一个新页面
2014/10/10 Javascript
JavaScript截断字符串的方法
2015/07/15 Javascript
Javascript将数字转化成为货币格式字符串
2016/06/22 Javascript
Bootstrap datepicker日期选择器插件使用详解
2017/07/26 Javascript
Angular2进阶之如何避免Dom误区
2018/04/02 Javascript
Vue子组件向父组件通信与父组件调用子组件中的方法
2018/06/22 Javascript
Vue状态模式实现窗口停靠功能(灵动、自由, 管理后台Admin界面)
2020/03/06 Javascript
Python中列表的一些基本操作知识汇总
2015/05/20 Python
Python环境搭建之OpenCV的步骤方法
2017/10/20 Python
Python使用matplotlib绘制正弦和余弦曲线的方法示例
2018/01/06 Python
Python3用tkinter和PIL实现看图工具
2018/06/21 Python
Python爬取成语接龙类网站
2018/10/19 Python
scrapy-redis源码分析之发送POST请求详解
2019/05/15 Python
Python实现的统计文章单词次数功能示例
2019/07/08 Python
pytorch之添加BN的实现
2020/01/06 Python
python3 Scrapy爬虫框架ip代理配置的方法
2020/01/17 Python
浅谈cv2.imread()和keras.preprocessing中的image.load_img()区别
2020/06/12 Python
中科前程Java笔试题
2016/11/20 面试题
中学校庆方案
2014/03/17 职场文书
大一新生期末自我评价
2014/09/12 职场文书
落实八项规定专题民主生活会对照检查材料
2014/09/15 职场文书
学生喝酒检讨书500字
2014/11/02 职场文书
2014年卫生监督工作总结
2014/12/09 职场文书
社会主义核心价值观主题教育活动总结
2015/05/07 职场文书
教师继续教育反思周记
2015/06/25 职场文书