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 相关文章推荐
jquery打开直接跳到网页最下面、最低端实现代码
Apr 22 Javascript
js clearInterval()方法的定义和用法
Nov 11 Javascript
使用BootStrap实现表格隔行变色及hover变色并在需要时出现滚动条
Jan 04 Javascript
详谈Ajax请求中的async:false/true的作用(ajax 在外部调用问题)
Feb 10 Javascript
Vue.set() this.$set()引发的视图更新思考及注意事项
Aug 30 Javascript
vue移动端监听滚动条高度的实现方法
Sep 03 Javascript
Vue 组件修改根实例的数据的方法
Apr 02 Javascript
JS实现checkbox互斥(单选)功能示例
May 04 Javascript
微信小程序收货地址API兼容低版本解决方法
May 18 Javascript
对Layer UI 模块化的用法详解
Sep 26 Javascript
vue 使用鼠标滚动加载数据的例子
Oct 31 Javascript
微信小程序新闻网站详情页实例代码
Jan 10 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
linux平台编译安装PHP7并安装Redis扩展与Swoole扩展实例教程
2016/09/30 PHP
js中的escape及unescape函数的php实现代码
2007/09/04 Javascript
Javascript 获取滚动条位置等信息的函数
2009/09/08 Javascript
jQuery 使用手册(三)
2009/09/23 Javascript
jquery 操作日期、星期、元素的追加的实现代码
2012/02/07 Javascript
AngularJS入门教程(二):AngularJS模板
2014/12/06 Javascript
Node.js 制作实时多人游戏框架
2015/01/08 Javascript
Javascript实现飞动广告效果的方法
2015/05/25 Javascript
学习JavaScript设计模式之代理模式
2016/01/12 Javascript
jquery ztree实现树的搜索功能
2016/02/25 Javascript
jQuery实现百度登录框的动态切换效果
2017/04/21 jQuery
jQuery选择器_动力节点Java学院整理
2017/07/05 jQuery
jQuery动态操作表单示例【基于table表格】
2018/12/06 jQuery
原生JavaScript实现日历功能代码实例(无引用Jq)
2019/09/23 Javascript
微信公众号开发之微信支付代码记录的实现
2019/10/16 Javascript
简单了解JavaScript作用域
2020/07/31 Javascript
Python中实现字符串类型与字典类型相互转换的方法
2014/08/18 Python
python制作爬虫爬取京东商品评论教程
2016/12/16 Python
利用Celery实现Django博客PV统计功能详解
2017/05/08 Python
Python实现动态图解析、合成与倒放
2018/01/18 Python
Python图像处理之图像的缩放、旋转与翻转实现方法示例
2019/01/04 Python
python+selenium 点击单选框-radio的实现方法
2019/09/03 Python
tensorflow 动态获取 BatchSzie 的大小实例
2020/06/30 Python
Python调用系统命令os.system()和os.popen()的实现
2020/12/31 Python
python和opencv构建运动检测器的实现
2021/03/03 Python
Vivo俄罗斯官方在线商店:中国智能手机品牌
2019/10/04 全球购物
俄罗斯儿童和青少年服装、鞋子及配件的在线商店:Orby
2020/02/20 全球购物
机械设计及其自动化求职推荐信
2014/02/17 职场文书
党员公开承诺书范文
2014/03/25 职场文书
法律专业自荐信
2014/06/03 职场文书
安全生产一岗双责责任书
2014/07/28 职场文书
小学教师自我剖析材料
2014/09/29 职场文书
政府班子四风问题整改措施思想汇报
2014/10/08 职场文书
加强作风建设演讲稿
2014/10/24 职场文书
2014年销售人员工作总结
2014/11/27 职场文书
CentOS安装Nginx并部署vue
2022/04/12 Servers