window.location.hash使用总结

最新推荐文章于 2025-03-28 22:02:21 发布
原创 最新推荐文章于 2025-03-28 22:02:21 发布 · 7.8k 阅读 · 1 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文介绍了在不同浏览器中处理页面元素ID与链接名称冲突的问题，并提供了解决方案。使用jQuery的hashchange事件可以在现代浏览器中监听点击后退按钮时hash的变化。针对IE7及更低版本的浏览器，文章推荐了一个jQuery插件。

如果a的name和页面中某个元素的id同名的话，在Safari、Chrome浏览器中会跳到id元素的位置，在IE中则会跳到a元素的位置

可以使用jQuery的haschange事件来侦听浏览器点击后退时的hash变化的事件.

$(window).bind('hashchange', function () {
            //
});

不过以上方案在IE浏览器只能支持到IE8，对于IE7及更早的浏览器就不支持了，解决方法是使用jQuery插件:

http://benalman.com/projects/jquery-hashchange-plugin/

JavaScript基础知识 - window.location.hash
laugh666的博客
09-28 405
在JavaScript中，window.location对象用于获取或设置当前页面的URL信息。其中，window.location.hash属性用于获取或设置URL中的片段标识符（hash）。本文将详细介绍window.location.hash的用法，并提供相应的源代码示例。通过使用window.location.hash，我们可以方便地获取和设置URL中的片段标识符，并根据其变化进行相应的操作，实现页面内的导航和定位功能。
【JavaScript】window.location详解
a451319296的博客
08-05 9675
在网页浏览器环境中，window.location是一个指向当前窗口的Location对象。它提供了一系列属性和方法，用于获取和操作当前页面的URL信息。
使用window.location.hash解决ajax刷新和导航问题
comeoncomputer的专栏
11-27 1902
参考地址：http://www.ggat.cn/newsInfo.html/145 hash 属性是一个可读可写的字符串，该字符串是 URL 的锚部分（从 # 号开始的部分）。 我们可以通过在进行ajax操作时设置hash属性来进行关联，从而解决页面刷新、前进和后退操作时，通过ajax修改的页面失效的问题。 实现起来很简单，比如页面上有2种ajax操作：搜索，编辑，我们可以在页面
window.location.hash 使用说明
时清云的博客
08-16 1295
location是javascript里边管理地址栏的内置对象，比如location.href就管理页面的url，用location.href=url就可以直接将页面重定向url。而location.hash则可以用来获取或设置页面的标签值。比如http://domain/#admin的location.hash=”#admin”。利用这个属性值可以做一个非常有意义的事情。window.locati
关于window.location.hash的理解及其应用
zhuchuji的博客
02-25 8409
location.hash的理解
window.location.hash和window.location.search和window.location.href的区别
Gx754649的博客
07-26 1433
window.location.hash和window.location.search和window.location.href的区别
window.location.hash的应用及浏览器的支持测试
tanggesun的专栏
03-14 492
本文出自：http://ued.alimama.com/front-end/window-location-hash-test/ location是javascript里边管理地址栏的内置对象，比如location.href就管理页面的url，用location.href=url就可以直接将页面重定向url。而location.hash则可以用来获取或设置页面的标签值。比如http://ue
window.location.hash解析
04-17
这篇博客文章可能详细讲解了如何使用和解析`window.location.hash`。 哈希值在网页中的主要用途是实现页面内部跳转，例如，如果有一个长页面，我们可以在链接中指定一个哈希值，当用户点击这个链接时，浏览器不会...
前端知识点---window.location.assign() 和 window.location.href 的区别(javascript)
最新发布
2302_80171619的博客
03-28 842
如果需要读取 URL 或简单跳转，href 更方便；如果只想执行跳转且强调跳转行为，assign() 更合适。平常用的window.location.href 更多。
编程实现可靠数据传输原理Go-Back-N
11-30
运用编程语言实现基于Go-Back-N 的可靠数据传输软件
go-back-n协议模拟swing界面
05-02
题目三： Go-Back-N Protocol 协议仿真（90分） 设计要求： 1） 模拟实现go-back-N协议功能 2） 发送窗口没有收到确认的包的值最大值为5 3） 当发送端窗口满时，发送端继续发送第六或者更多的包，将会发生什么？请在设计中体现出来。
小发现之浅谈location.search与location.hash的问题
08-30
在使用location.search和location.hash时，需要注意它们之间的关系。例如，在URL中同时存在search和hash时，如果hash值放在search后面，可能会导致无法获取search参数。例如：...
window.location.hash 保存前进、后退过程中的页面链接信息
ajian11的专栏
08-22 507
<script type="text/javascript">        window.onload = OnHash; function OnHash()  { var monitorHash = window.location.hash;  var sIndex = monitorHash.match("[^#MonitorTabIndex=][0-9]*");   if...
window.location.hash常用方法
铭霏的记事本
02-11 5980
window.location.href是在js中经常见到的获取url链接的方式 而我们在一些url中却看到过类似的地址 http://www.abc.com/a/index.html#m2 其中的#m2 就是location.hash loation.hash常与锚点联系起来使用 例如: function getAnchor(anchor_nam
jQuery不支持hashchange事件？
weixin_30634661的博客
09-05 569
$(window) .bind( 'hashchange', onHashchange ) .trigger( 'hashchange' ); 　　jQuery版本是1.9.1的，去源码里没找到hashchange的相关内容，所以靠事件模拟里进行hashchange。 　　jq源码里找不到hashchange的相关内容，难道就说明jQuery不支持hashchang...
jQuery hashchange监听浏览器url变化
weixin_33943347的博客
08-04 3805
$(window).bind('hashchange', function() { // });  
使用 window.location.hash 优点缺点
06-08
`window.location.hash` 是 JavaScript 中的一个属性，用于获取或设置页面的 URL 中的锚点部分（即 `#` 后面的部分）。使用 `window.location.hash` 可以在页面之间进行无刷新的跳转，具有以下优点和缺点： 优点： 1. 无需刷新页面即可进行跳转，用户体验较好。 2. 可以在同一页面内实现不同内容的切换，例如单页应用（SPA）中通常使用 `window.location.hash` 实现路由功能。 3. 可以通过 `window.onhashchange` 事件监听 URL 中的锚点变化，实现一些动态效果，例如面包屑导航、分页等。 缺点： 1. `window.location.hash` 只能跳转到同一页面内的锚点位置，无法跳转到其他页面。 2. 使用 `window.location.hash` 跳转时，浏览器的历史记录不会被更新，导致浏览器的后退按钮失效。 3. 如果 URL 中带有复杂的参数，使用 `window.location.hash` 可能会比较麻烦，需要进行一些额外的处理。 综上所述，`window.location.hash` 是一种比较常用的页面跳转方式，适用于一些简单的场景，但在复杂的应用中还需要结合其他方式使用。
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值