H5历史API之pushstate

最新推荐文章于 2022-08-30 21:58:47 发布

zoekitty

最新推荐文章于 2022-08-30 21:58:47 发布

阅读量779

点赞数

CC 4.0 BY-SA版权

分类专栏： html5 文章标签： pushstate

本文链接：https://blog.youkuaiyun.com/zoekitty/article/details/52735836

html5 专栏收录该内容

1 篇文章

订阅专栏

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
<input type="button" onclick="add()" value="点击我啊"/>
</body>
<script>
    function add(){
        //判断浏览器是否支持这个api
        if(window.history&&history.pushState){
            //支持
            history.pushState(new Date(),"设置历史状态显示的标题，但是浏览器不支持",'?demo='+new Date().toLocaleString());
            //new Date()获取的是一个事件对象
            //toLocalTimeString转换成我们认识的时间字符串
            //toLocalDateString转换成我们认识的日期字符串

            console.log(new Date());
            console.log(new Date().toLocaleDateString());

        }else{
            console.log("不支持");
        }
    }

    window.addEventListener('popstate',function(e){
        //后退或前进的操作
        console.log("1111"+ e.state);
    })
</script>
</html>