zoukankan      html  css  js  c++  java
  • h5历史管理

    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <title>h5历史管理</title>
    <script>
    window.onload = function(){
      var odiv = document.querySelector('#box');
      var oipt = document.querySelector('input');

      oipt.onclick = function(){

        var arr = randomNum(35,7);

        history.pushState(arr,'');

        odiv.innerHTML = arr;

      };
      function randomNum(iAll, iNow){
        var arr = [];
        var nArr = [];
        for(var i = 1;i <= iAll; i++){
          arr.push(i);
        }

        for(var i = 0; i< iNow; i++){
          nArr.push(arr.splice(Math.floor(Math.random()*arr.length),1));
        }
        return nArr;
      }
      window.onpopstate = function(ev){
        odiv.innerHTML = ev.state;
      }
    }

    </script>
    </head>
    <body>

    <input type="button" value="随机选择" id="btn">

    <div id="box" data-name='vsmart' class="box box2 box3">box1</div>


    </body>
    </html>

  • 相关阅读:
    《构建之法阅读笔记02》
    《人月神话阅读笔记01》
    第四周学习进度条
    子数组2
    敏捷开发方法综述
    子数组1
    第三周学习进度条
    四则运算3
    第二周学习进度条
    四则运算4
  • 原文地址:https://www.cnblogs.com/vsmart/p/6688903.html
Copyright © 2011-2022 走看看