当前位置: 首页 > 编程笔记 >

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

严峰
2023-03-14
本文向大家介绍浅谈json取值(对象和数组),包括了浅谈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取值(对象和数组)全部内容了,希望大家多多支持小牛知识库~

 类似资料:
  • 本文向大家介绍浅谈C++对象组合,包括了浅谈C++对象组合的使用技巧和注意事项,需要的朋友参考一下 以上所述就是本文的全部内容了,希望大家能够喜欢。

  • 问题内容: 我是JSON的新手。因此,如果这是一个非常基本的疑问,请不要责骂我。我有一个JSON对象参考,我想获取Key(对象只有一个“键值对”)。如何在Java中获得它? 问题答案: 您可以用来获取所有密钥。然后,您可以遍历密钥以从中获得第一个密钥,例如:

  • 本文向大家介绍浅谈Javascript中的对象和继承,包括了浅谈Javascript中的对象和继承的使用技巧和注意事项,需要的朋友参考一下 Javascript是一门函数式编程语言,Javascript当中函数是核心,在Javascript中函数也是对象,函数对象在创建的时候会被添加属性和方法。 在Javascript中函数对象有两种调用方式,一种是new关键字的调用,另一种是没有new关键字的调

  • 本文向大家介绍浅谈Javascript事件对象,包括了浅谈Javascript事件对象的使用技巧和注意事项,需要的朋友参考一下 如果是事件处理函数绑定的函数,浏览器会默认传递一个参数,而这个参数就是事件对象。 因为arguments[0]这样使用这个参数比较麻烦,所以我们可以传递一个参数evt来进行使用。 以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支

  • 本文向大家介绍浅谈C#.NET、JavaScript和JSON,包括了浅谈C#.NET、JavaScript和JSON的使用技巧和注意事项,需要的朋友参考一下 写在前面 全部手打,没有多余的话,全部干货,基本上用到的我就记录了。 一、什么是JSON JSON:JavaScript Object Notation,是一种轻量级的数据交互格式,主要用于数据传输。 二、JSON语法规则  1、数据由键值

  • 本文向大家介绍浅谈JavaScript对象与继承,包括了浅谈JavaScript对象与继承的使用技巧和注意事项,需要的朋友参考一下 JavaScript是我在C语言之后接触的第二门编程语言,大一暑假的时候在图书馆找了一本中国人写的JavaScript程序设计来看。那个时候在编程方面几乎还是小白,再加上那本书根本没有提JavaScript的编程机制,又有一些误导性的话,一直以来对JavaScript