HTML5实现历史存储的方法
1.通过onhashchange实现
当hash值发生变化的时候,就会触发onhashchange事件
var btn=document.querySelector('#btn');
var input=document.querySelector('#input');
var num;
//hash
btn.onclick=function(){
num=Math.floor(Math.random()*10);
window.location.hash=num;//将数据存储在hash
input.value=num;
};
window.onhashchange=function(){
var num=window.location.hash.substring(1);//取数据
input.value=num;
};
2.通过history实现
存数据history.pushState( a,b,c) 三个参数 数据 标题(都没有实现) 网址()可选
取数据: window.onpopstate=function(e){Var num=e.state; //在这里取数据 然后下面操作
}
—注意:网址是虚假的,需要在服务器指定对应的页面,不然刷新找不到页面
//history
btn.onclick=function(){
num=Math.floor(Math.random()*10);
history.pushState(num,'');
input.value=num;
};
window.onpopstate=function(e){
var num=e.state;
input.value=num;
};
原文链接:https://www.f2er.com/note/422079.html