js的JSON新方法和历史记录管理

浏览数：40 / 时间：2015年06月09日

今天看妙味的视频，一下是一些简单的笔记：

1.JSON的一些新方法：

JSON.stringify(); 
JSON.parse();

第一个是把js脚本转换成JSON的字符串形式。

而第二个则是吧这种字串形式的JSON解析出来。具体使用可以百度查询。

新方法，自然就牵扯到兼容问题，老师提到，到json.org也就是json官网去下载一个脚本json2.js，在使用时包含进去，新方法可以兼容到IE7.

2.触发历史管理：1.通过跳转页面 2.通过hash(onhashchange事件) 3.pushState

demo如下：

<body>
    <input type="button" id="input1" value="获取彩票">
    <div id="div1"></div>
<script type="text/javascript">
// 触发历史管理：1.通过跳转页面    2.通过hash(onhashchange事件)    3.pushState
/*window.onload = function(){
    var oIpt = document.getElementById(‘input1‘);
    var oDiv = document.getElementById(‘div1‘);
    var json = {};

    oIpt.onclick = function(){
        var num = Math.random();
        var arr = randomNum(25,7);
        json[num] = arr;
        oDiv.innerHTML = arr;
        window.location.hash = num;
    };

    window.onhashchange = function(){
        oDiv.innerHTML = json[window.location.hash.substring(1)];

    };
    function randomNum(iAll,iNow){
        var arr = [];
        var newArr = [];
        for(var i=1;i<iAll;i++){
            arr.push(i);
        }
        
        for(var i=0;i<iNow;i++){
            newArr.push(arr.splice(Math.floor(Math.random()*arr.length),1));
        }
        return newArr;
    }
}*/
// 使用pushState
window.onload = function(){
    var oIpt = document.getElementById(‘input1‘);
    var oDiv = document.getElementById(‘div1‘);

    oIpt.onclick = function(){
        var arr = randomNum(55,8);
        history.pushState(arr,‘‘,arr);
        oDiv.innerHTML = arr;
    };

    window.onpopstate = function(ev){
        oDiv.innerHTML = ev.state;
    };
    function randomNum(iAll,iNow){
        var arr = [];
        var newArr = [];
        for(var i=1;i<iAll;i++){
            arr.push(i);
        }
        
        for(var i=0;i<iNow;i++){
            newArr.push(arr.splice(Math.floor(Math.random()*arr.length),1));
        }
        return newArr;
    }
};
</script>
</body>