JS监听浏览器地址栏URL变化

JS监听浏览器地址栏URL变化

松林羊

于 2019-10-18 20:43:22 发布

8930
收藏 3
分类专栏: 前端 JavaScript 文章标签: JS监听URL变化
版权

前端
同时被 2 个专栏收录
3 篇文章0 订阅
订阅专栏

JavaScript
2 篇文章0 订阅
订阅专栏
假设业务场景:视屏or图片只在首页展示。
URL格式:http://localhost:4000/page/2/

HTML中实现
<body onhashchange="myFunction()">
</body>
<script>
function myFunction() {
var href = window.location.href;
var idx = href.indexOf('page/');
if(href.substring(idx+5,idx+6)>1){
//设置视频or图片不可见
}
}
</script>
1
2
3
4
5
6
7
8
9
10
11
JS实现
方式一
if( ('onhashchange' in window) && ((typeof document.documentMode==='undefined') || document.documentMode==8)) {
var href = window.location.href;
var idx = href.indexOf('page/');
if(href.substring(idx+5,idx+6)>1){
//设置视频or图片不可见
}
}
1
2
3
4
5
6
7
方式二
<script>
document.getElementsById("bd").onhashchange = function() {
myFunction()
};
function myFunction() {
var href = window.location.href;
var idx = href.indexOf('page/');
if(href.substring(idx+5,idx+6)>1){
//设置视频or图片不可见
}
}
</script>
1
2
3
4
5
6
7
8
9
10
11
12
方式三
<script>
window.addEventListener("hashchange", myFunction);
function myFunction() {
var href = window.location.href;
var idx = href.indexOf('page/');
if(href.substring(idx+5,idx+6)>1){
//设置视频or图片不可见
}
}
</script>
————————————————
版权声明:本文为CSDN博主「松林羊」的原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接及本声明。
原文链接:https://blog.csdn.net/github_33809414/article/details/102631579

posted on 2022-05-27 17:18  漫思  阅读(888)  评论(0编辑  收藏  举报

导航