• HTML5 存取Json


    Html5可以通过json来存储读取一些比较复杂的对象,比如一个学生表的姓名,学号,地址,邮箱等信息,我们可以创建一个Object来包括这些信息,然后将Object对象转换为json对象存放在localStorage。

    存储函数:

      function save2LocalStorage(){
         var tableInfo = new Object;
         tableInfo.name=document.getElementById("name").value;
         tableInfo.email=document.getElementById("email").value;
         tableInfo.studentID=document.getElementById("studentID").value;
         tableInfo.address=document.getElementById("address").value
         var str = JSON.stringify(tableInfo);
         localStorage.setItem(tableInfo.name,str);
      }

    之后我们可以通过用户名称搜索已经存储在localStorage中的学生信息并显示在一个Element中,查询函数如下:

     function findFromLocalStorage(id){
         var searchName = document.getElementById("search").value;
         var str=localStorage.getItem(searchName);
         var tableInfo= JSON.parse(str);
         var result="姓名:"+tableInfo.name+'<br>';
         result+="邮箱:"+tableInfo.email+'<br>';
         result+="学号:"+tableInfo.studentID+'<br>';
         result+="住址:"+tableInfo.address+'<br>';
         var target = document.getElementById(id);
         target.innerHTML = result;
      }

    在这里面Json的序列化和解析用到的douglascrockford 开源脚本。

    相关效果如下:

    完整代码

  • 相关阅读:
    事件总线2
    微信小程序视频录制教程
    vue插件开发-toast
    云计算中的测试,可从哪些维度入手
    ES配置及FAQ
    Azkaban安装及问题
    python 反编译 compileall
    平凡利用redis进行数据读写的一种优化
    彻底弄懂Redis的内存淘汰策略
    c# 判断年龄精确到日
  • 原文地址:https://www.cnblogs.com/alirong/p/3077865.html
Copyright © 2020-2023  润新知