一、当前页面:可以通过location.hash进行设置
location.hash = 'sss'
console.log(location.hash);
设置后可以通过location.hash访问
会将该值拼接到url上
用法:在要跳转的html元素上设置name属性,然后设置location.hash值就可以实现页面内跳转。注意:如果跳转后如果location.hash不清空就无法继续跳转。
<html>
<head>
<style>
.box {
width: 200px;
height: 3000px;
background-color: pink;
}
.box2 {
width: 100px;
height: 200px;
background-color: black;
}
</style>
</head>
<body>
<div class="box"></div>
<a name="sss">ssss</a>
<script type="text/javascript">
var box = document.querySelector('.box');
box.addEventListener('click', function() {
location.hash = 'sss'
console.log(location.hash);
});
</script>
</body>
</html>
2、跳转到其他页面
w3c中给出的例子:
var x = window.open("test.html", "", "scrollbars=yes,width=250,height=200")
x.location.hash = '3';
实测通过这种方式location.hash的值无法在浏览器控制台显示,并且url后面也没有location.hash的值(有没有懂的解释下)
解决方案:(1)直接在当前页面拼接url地址
var x = window.open("test.html#sss", "", "scrollbars=yes,width=250,height=200")
(2)在跳转页面通过load事件给location.hash赋值
window.addEventListener('load', function() {
// location.hash = 3;
console.log(location.hash);
})