浅谈json取值(对象和数组)

按对象取值：

jQuery代码如下

(function ($) {
      $.getJSON('ajax/test.json', function (data) {
        var items = [];

        $.each(data.comments, function (key, val) {
          items.push('<li class="' + 'tag' + val.class + '">' + '<a href="#">' + val.content + '</a>' + '</li>');
        });

        //第一个标签
        $('<ul/>', {
          'class':'',
          html:items.join('')
        }).appendTo('.tags');

        //第二个标签
        $('<ul/>', {
          'class':'alt',
          html:items.join('')
        }).appendTo('.tags');
      });
    })(jQuery);

json代码如下

{"comments":[
  {
    "class":"1",
    "content":"Lorem ipsum"
  },
  {
    "class":"2",
    "content":"Dolor sit amet"
  },
  {
    "class":"3",
    "content":"Consectetur adipiscing elit"
  },
  {
    "class":"2",
    "content":"Proin"
  },
  {
    "class":"4",
    "content":"Sagittis libero"
  },
  {
    "class":"1",
    "content":"Aliquet augue"
  },
  {
    "class":"1",
    "content":"Quisque dui lacus"
  },
  {
    "class":"5",
    "content":"Consequat"
  },
  {
    "class":"2",
    "content":"Dictum non"
  },
  {
    "class":"1",
    "content":"Venenatis et tortor"
  },
  {
    "class":"3",
    "content":"Suspendisse mauris"
  },
  {
    "class":"4",
    "content":"In accumsan"
  },
  {
    "class":"1",
    "content":"Egestas neque"
  },
  {
    "class":"5",
    "content":"Mauris eget felis"
  },
  {
    "class":"1",
    "content":"Suspendisse"
  },
  {
    "class":"2",
    "content":"condimentum eleifend nulla"
  }
]}

按数组取值：

jQuery代码如下

(function ($) {
      $.getJSON('ajax/test_array.json', function (data) {
        var items = [];

        $.each(data.comments, function (key, val) {
          items.push('<li class="' + 'tag' + val[0] + '">' + '<a href="#">' + val[1] + '</a>' + '</li>');
        });

        //第一个标签
        $('<ul/>', {
          'class':'',
          html:items.join('')
        }).appendTo('.tags');

        //第二个标签
        $('<ul/>', {
          'class':'alt',
          html:items.join('')
        }).appendTo('.tags');
      });
    })(jQuery);

json代码如下

{"comments":[
  ["1", "Lorem ipsum"],
  ["2", "Dolor sit amet"],
  ["3", "Consectetur adipiscing elit"],
  ["2", "Proin"],
  ["4", "Sagittis libero"],
  ["1", "Aliquet augue"],
  ["1", "Quisque dui lacus"],
  ["5", "Consequat"],
  ["2", "Dictum non"],
  ["1", "Venenatis et tortor"],
  ["3", "Suspendisse mauris"],
  ["4", "In accumsan"],
  ["1", "Egestas neque"],
  ["5", "Mauris eget felis"],
  ["1", "Suspendisse"],
  ["2", "condimentum eleifend nulla"]
]}

共用的HTML代码如下

 <div class="tags"></div>

明显可以看出按数组取值的数据量会小很多

以上就是小编为大家带来的浅谈json取值(对象和数组)全部内容了，希望大家多多支持我们~

赞 (0)

相关推荐

  • 实例详解JSON取值(key是中文或者数字)方式

    JSON取值(key是中文或者数字)方式详解 先准备一个json对象用于演示 var json = {'name':'zhangsan', '年龄':23, 404:'你可能迷路了'}; 1.使用JS中with关键字 with(json) { console.log(name);//输出:zhangsan console.log(年龄);//输出:23 console.log(404);//输出:404,用这种方法读取key是数字的属性,有问题 } 2.最常见的传统的读取key console.

  • 当json键为数字时的取值方法解析

    当json的键为数字时如何取值,如: var aa={'111':'aaaaa'}; alert(sss.111); 这样是不行的,alert不会弹任何东西. json的键必须是一个对象,才能取出东西,如: var aa={'s111s':'aaaaa'}; var idd="s111s"; alert(sss.idd); 解答: 对于数字键名或者非正常变量字符(比如有空格),必须使用 aa[x]的方式.var aa={'111':'aaaaa'}; alert(sss["1

  • jquery实现下拉菜单的二级联动利用json对象从DB取值显示联动

    jquery实现下拉菜单的二级联动利用json对象从DB取值显示联动

    利用struts2和Ajax实现json对象的传输,然后实现菜单的二级联动 下面是我的 js文件原码: 复制代码 代码如下: var mail={ //初始化 init:{ //初始化数据 initdata:{ did:'', ttitle:'', sendpassword:'', description:'' }, //初始化事件 initevent:{ DataEvent:function(){ $("#did").unbind("change");//获取一级

  • java json字符串转JSONObject和JSONArray以及取值的实例

    java json字符串转JSONObject和JSONArray以及取值的实例 实现代码: import net.sf.json.JSONArray; import net.sf.json.JSONObject; public class JsonTest { public static void main(String[] args) { String joStr = "{name:\"张三\",age:\"20\"}"; //将json字符

  • 百度编辑器从Json对象中取值，完成初次渲染，在编辑器内画表格

    第一次做企业级应用,感觉一点:对逻辑必须要非常明确,而且有了很多与之前不一样的概念. 在百度编辑器中,如何完成从服务器取值,来渲染出表格?这里需要先console.log(editor);在官方API中已经告诉我们写入的方法是setContent(),这里只要能传入我们最终拼好的的字符串,即可以在初始化中,绘制出我们想要的任何节点. 再send()完成之后,onreadystatechange = function(){},先上一段AJAX的代码.这段AJAX是消除游览器兼容,从尼古拉斯的书中学

  • js遍历json对象所有key及根据动态key获取值的方法(必看)

    实例如下: var obj = {}; for(var k in obj) { //遍历对象,k即为key,obj[k]为当前k对应的值 console.log(obj[k]); } 以上这篇js遍历json对象所有key及根据动态key获取值的方法(必看)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持我们.

  • JSON取值前判断

    复制代码 代码如下: public static void main(String[] args)throws Exception{      String jsonStr1="{\"access_token\":\"OezXcEiiBSKSxW0eoylIeIVb08lFhyeFsq6cUJJNo8XYLoJjqYARJOZUrnqhfvnyMKOSjz5SHPHGUmt6f09_762MWQ0HLnZtffDPyD2A6TgCqWlZAEsHLhIaaQVYx1

  • 浅谈json取值(对象和数组)

    按对象取值: jQuery代码如下 (function ($) { $.getJSON('ajax/test.json', function (data) { var items = []; $.each(data.comments, function (key, val) { items.push('<li class="' + 'tag' + val.class + '">' + '<a href="#">' + val.content

  • 浅谈JavaScript中的对象及Promise对象的实现

    浅谈JavaScript中的对象及Promise对象的实现

    JavaScript 中的所有事物都是对象:字符串.数值.数组.函数.下面小编给大家收集整理些javascript中的对象及promise对象的实现.具体内容如下: 到处都是对象 window对象 常用的属性和方法介绍 location 包含页面的URL,如果改变这个属性,浏览器会访问新的URL status 包含将在浏览器状态去显示的一个串.一般在浏览器左下角 onload: 包含了需要在页面完全加载后调用的函数 document: 包含DOM alert方法: 显示一个提醒 prompt方法

  • 浅谈JSON的数据交换、缓存问题和同步问题

    JSON轻量级的数据交换格式 相对于XML来说,JSON的解析速度更快,文档更小. JSON的格式 {属性名:属性值,属性名:属性值,--} 属性名的类型可以是string,number,boolean,null,object,且属性名必须用双引号引起来,如果属性值是字符串,也必须用双引号括起来. JSON表示数组 格式:[value,value,value],其中value可以是基本的数据类型,也可以是object类型.数组类型 数组类型 [ {"name":"yangjq

  • 浅谈PHP中类和对象的相关函数

    浅谈PHP中类和对象的相关函数

    class_exists 判断一个类是否存在,参数为一个名字! interface_exists 判断一个接口是否存在,参数也是为一个名字! method_exists 判断一个方法是否存在! 需要两个:第一个对象变量,第二个是一个方法名! 返回一个布尔值! 判断某个属性是否存在,就是使用isset get_class 获得当前对象所属的类! 参数是一个对象! get_parent_class 获得对象的父类名! get_class_methods 需要一个参数为一个类名,返回一个索引数组,里面

  • 浅谈js内置对象Math的属性和方法(推荐)

    属性: constructor 所建立对象的函数参考 prototype 能够为对象加入的属性和方法 E 欧拉常量,自然对数的底(约等于2.718) LN2 2的自然对数(约等于0.693) LN10 10的自然对数(约等于2.302) LOG2E 以2为底的e的对数.(约等于1.442) LOG10E 以10为底的e的对数(约等于0.434) PI ∏的值(约等于3.14159) SQRT1_2 1/2(0.5)的平方根(即l除以2的平方根,约等于o.707) SQRT2 2的平方根(约等于1

  • 浅谈C/C++中指针和数组的不同

    这边先简单介绍一下内存分区. 内存按照用途划分为五个区: 1.栈区:由系统控制分配和回收. 例如定义变量 int x = 0; int *p = NULL; 变量所占的内存都是分配在栈区的. 2.堆区:由程序员管理. 在C语言中由 malloc 申请的内存,或者在C++中,用 new 申请的内存,是在堆区中申请的.用完之后需要程序员自己回收,否则会造成内存泄漏. 3.全局区:存储全局变量及静态变量 4.常量区:存储常量. 5.代码区:存储编译之后的二进制代码. 数组和指针具有很大的相似性,实际上

  • 浅谈JS正则RegExp对象

    目录 1.RegExp对象 2.语法 2.1 定义 2.2 修饰符 2.3 方括号 2.4 元字符 2.5 量词 2.6 方法 1.RegExp对象 正则表达式是描述字符模式的对象. 正则表达式用于对字符串模式匹配及检索替换,是对字符串执行模式匹配的强大工具. 参考教材:w3cschool | JavaScript RegExp 对象 2.语法 2.1 定义 当使用 构造函数 创造正则对象时,需要常规的字符转义规则(在前面加反斜杠 \) /* 比如,以下两种方式的定义是等价的 */ // 构造函

  • 浅谈JS读取DOM对象(标签)的自定义属性

    DOM对象对于js来说,是个很基础的元素,我们写js一般来说,都一定会对它进行操作.我们可以很方便地给它加上自定义的属性,比如: <div id="test" class="hello"></div> var test = document.getElementById("test"); test.adang = "adang"; alert(test.adang); 我们会发现,已经给这个id为tes

  • 浅谈JavaScript的计时器对象

    浅谈JavaScript的计时器对象

    1.JavaScript计时器,我们可以在设定的时间间隔之后来执行代码,而不是在函数被调用后立即执行. 计时器类型: 1)一次性计时器:仅在指定的延迟时间之后触发一次. 2)间隔性触发计时器:每隔一定的时间间隔就触发一次. 计时器方法: 1)setInterval() :在执行时,从载入页面后每隔指定的时间执行代码. //语法 setInterval(代码,交互时间); //参数说明:1. 代码:要调用的函数或要执行的代码串.2. 交互时间:周期性执行或调用表达式之间的时间间隔,以毫秒计(1s=

随机推荐