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倒计时功能实现代码
Jun 07 Javascript
网页加载时页面显示进度条加载完成之后显示网页内容
Dec 23 Javascript
replace()方法查找字符使用示例
Oct 28 Javascript
纯JS实现本地图片预览的方法
Jul 31 Javascript
jQuery实现响应鼠标滚动的动感菜单效果
Sep 21 Javascript
seajs模块之间依赖的加载以及模块的执行
Oct 21 Javascript
jQuery Easyui加载表格出错时在表格中间显示自定义的提示内容
Dec 08 Javascript
Vue2组件tree实现无限级树形菜单
Mar 29 Javascript
Javascript(es2016) import和require用法和区别详解
Aug 11 Javascript
开发Vue树形组件的示例代码
Dec 21 Javascript
浅谈Webpack多页应用HMR卡住问题
Apr 24 Javascript
微信小程序实现日历小功能
Nov 18 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
PHP批量生成缩略图的代码
2008/07/19 PHP
PHP新手NOTICE错误常见解决方法
2011/12/07 PHP
Symfony2之session与cookie用法小结
2016/03/18 PHP
PHP简单创建压缩图的方法
2016/08/24 PHP
php使用flock阻塞写入文件和非阻塞写入文件的实例讲解
2017/07/10 PHP
PHP count_chars()函数讲解
2019/02/14 PHP
php多进程应用场景实例详解
2019/07/22 PHP
thinkphp5框架路由原理与用法详解
2020/02/11 PHP
ExtJS 2.0 GridPanel基本表格简明教程
2010/05/25 Javascript
JavaScript中的console.group()函数详细介绍
2014/12/29 Javascript
通过XMLHttpRequest和jQuery实现ajax的几种方式
2015/08/28 Javascript
js删除局部变量的实现方法
2016/06/25 Javascript
jQuery过滤选择器经典应用
2016/08/18 Javascript
JavaScript实现自定义媒体播放器方法介绍
2017/01/03 Javascript
Angular 5.x 学习笔记之Router(路由)应用
2018/04/08 Javascript
Vue2.x中利用@font-size引入字体图标报错的解决方法
2018/09/28 Javascript
使用 Vue 实现一个虚拟列表的方法
2019/08/20 Javascript
Vue.js实现可编辑的表格
2019/12/11 Javascript
[47:52]完美世界DOTA2联赛PWL S2 PXG vs InkIce 第二场 11.26
2020/11/30 DOTA
Python中is与==判断的区别
2017/03/28 Python
深入解答关于Python的11道基本面试题
2017/04/01 Python
浅谈python中列表、字符串、字典的常用操作
2017/09/19 Python
python使用socket创建tcp服务器和客户端
2018/04/12 Python
Python matplotlib 画图窗口显示到gui或者控制台的实例
2018/05/24 Python
利用Python+阿里云实现DDNS动态域名解析的方法
2019/04/01 Python
Django项目创建到启动详解(最全最详细)
2019/09/07 Python
Pytorch: 自定义网络层实例
2020/01/07 Python
Python OpenCV读取中文路径图像的方法
2020/07/02 Python
python dict如何定义
2020/09/02 Python
了解一下python内建模块collections
2020/09/07 Python
Pycharm Plugins加载失败问题解决方案
2020/11/28 Python
如何写一个Java类既可以用作applet也可以用作java应用
2016/01/18 面试题
对孩子的寄语
2014/04/09 职场文书
“四风”问题整改措施和努力方向
2014/09/20 职场文书
百年孤独读书笔记
2015/06/29 职场文书
Nginx tp3.2.3 404问题解决方案
2021/03/31 Servers