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

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>

js的JSON新方法和历史记录管理的更多相关文章

  1. JS操作JSON的方法总结

    JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式,采用完全独立于语言的文本格式,是理想的数据交换格式.同时,JSON是 JavaScript 原生格式,这意 ...

  2. 原生js格式化json的方法

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. JS中JSON.stringify()方法，将js对象（json串）转换成字符串，传入服务器

    JSON 通常用于与服务端交换数据. 在向服务器发送数据时一般是字符串. 我们可以使用 JSON.stringify() 方法将 JavaScript 对象转换为字符串. 语法 JSON.string ...

  4. js处理json的方法

    var json = "{id:"myid", url:"http://www.myurl.com"}"; var js= (new Fun ...

  5. 原生js格式化json和格式化xml的方法

    在工作中一直看各位前辈的博客解决各种问题,对我的帮助很大,非常感谢! 之前一直比较忙没有写博客,终于过年有了点空闲时间,可以把自己积累的东西分享下,笔记中的部分函数不是自己写的,都是工作中一点点积累的 ...

  6. JavaScript操作JSON的方法总结，JSON字符串转换为JSON对象

    JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式,采用完全独立于语言的文本格式,是理想的数据交换格式.同时,JSON是 JavaScript 原生格式,这意 ...

  7. js读取json数据（php传值给js）

    <?php $array =array('fds','fdsa','fdsafasd');  // json_encode($array); ?> <html> <hea ...

  8. 原生js格式化json工具

    json格式化小工具,原生js编写,直接上代码: <!DOCTYPE html> <html lang="en"> <head> <met ...

  9. js读取json数据

    { "code": 0, "msg": null, "data": { "pageNum": 1, "page ...

随机推荐

  1. span强制不换行

    <nobr>不换行内容</nobr> 无论多少文字均不希望换行显示,超出宽度的内容会显示不出来. <div> <nobr> <span class ...

  2. [C++] JsonCPP 的使用 完整配置过程

    最近准备开发一个程序 需要用到C++ 解析json 原始的C++解析json是不现实的 自己也写不出来json解析方法(主要是不靠谱) 所以找到了jsoncpp 这个库 但是... 因为各种原因 配置 ...

  3. 杭电ACM 1713 相遇周期

    相遇周期 Time Limit: 1000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Total Submis ...

  4. Go反射

    一.引入 不同语言的反射模型不尽相同,有些语言还不支持反射.<Go 语言圣经>中是这样定义反射的: Go 语言提供了一种机制在运行时更新变量和检查它们的值.调用它们的方法,但是在编译时并不 ...

  5. 2019 ICPC南京网络赛 F题 Greedy Sequence（贪心+递推）

    计蒜客题目链接:https://nanti.jisuanke.com/t/41303 题目:给你一个序列a,你可以从其中选取元素,构建n个串,每个串的长度为n,构造的si串要满足以下条件, 1. si ...

  6. 修改vsftpd的默认根目录/var/ftp/pub到其他目录

    修改ftp的根目录只要修改/etc/vsftpd/vsftpd.conf文件即可: 加入如下几行: local_root=/var/www/html chroot_local_user=YES ano ...

  7. 无显示器安装raspberry zero w树莓派 zero w

    笔者的环境 1. Macbook 电脑用于烧录树莓派系统到SD卡 2. 树莓派 zero w 把SD卡放进读卡器,插到Mac电脑上, 打开命令行工具Terminal diskutil list列出di ...

  8. MYSQL的索引类型：PRIMARY, INDEX,UNIQUE,FULLTEXT,SPAIAL 区别与使用场合

    normal 普通索引   unique 唯一的,不允许重复的索引 该字段信息保证不会重复例如身份证号用作索引时,可设置为unique full textl 全文搜索的索引 FULLTEXT 用于搜索 ...

  9. 洛谷 P1494 [国家集训队]小Z的袜子（莫队）

    题目链接:https://www.luogu.com.cn/problem/P1494 一道很经典的莫队模板题,然而每道莫队题的大体轮廓都差不多. 首先莫队是一种基于分块的算法,它的显著特点就是: 能 ...

  10. ElementUI+Vue在使用el-dialog时，如何做到在弹出dialog时，外部呈锁定状态，而不是点击外部导致dialog直接关闭。

    ElementUI+Vue在使用el-dialog时,如何做到在弹出dialog时,外部呈锁定状态,而不是点击外部导致dialog直接关闭. 问题描述 今天,在做Element+Vue项目时发现:Di ...