关于jQuery解析json格式数据实例效果

  • 时间:
  • 1370人关注

这篇文章主要介绍了jQuery解析json格式数据,涉及jQuery针对json格式数据元素遍历相关操作技巧,需要的朋友可以参考下,另外这篇文章主要知识点是关于jQuery、json、jQuery的内容,如果大家想对相关知识点有系统深入的学习,可以参阅以下电子资料:

教程详情电子资料
  • 教程类别:jQuery
  • 编辑整理:阙水蓉
  • 教程字数:1325字节
  • 阅读时间:大概13分钟
  • 下载本教程(DOC版)
  • 《从0到1:jQuery快速上手》课件,源码,习题答案
  • JSON-handle
  • JSON Formatter
  • JSON Viewer
  • Web前端开发技术(jQuery+Ajax 慕课版)
  • 本文实例讲述了jQuery解析json格式数据。分享给大家供大家参考,具体如下:

    var arr1 = [ "one", "two", "three", "four", "five" ];
    $.each(arr1, function(){
      alert(this);
    });
    

    输出:

    one   two  three  four   five

    var arr2 = [[1, 2, 3], [4, 5, 6], [7, 8, 9]]
    $.each(arr2, function(i, item){
      alert(item[0]);
    });
    
    

    输出:

    1   4   7

    var obj = { one:1, two:2, three:3, four:4, five:5 };
    $.each(obj, function(key, val) {
      alert(obj[key]);
    });
    
    

    输出:

    1   2  3  4  5

    //json格式
    var param = [{'subJobClass':'com.sample.quartz.MyJob','subJobMethod':'hello','taskParam':[{'username':'张三'},{'age':'28'},{'tel':'15818821129'}]}];
    //设置参数值
    if(param.length>0){
      alert(param[0].subJobClass);
      alert(param[0].subJobMethod);
      var taskParam = param[0].taskParam ;
      //遍历任务参数数组
      jQuery.each(taskParam,function(i, item){
        //解析单个任务参数
        jQuery.each(item ,function(key){
          alert(key);//key
                alert(item[key]);//value
              });
      });
    }
    
    

    感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具:http://tools.jb51.net/code/HtmlJsRun测试上述代码运行效果。

    PS:关于json操作,这里再为大家推荐几款比较实用的json在线工具供大家参考使用:

    在线JSON代码检验、检验、美化、格式化工具:
    http://tools.jb51.net/code/json

    JSON在线格式化工具:
    http://tools.jb51.net/code/jsonformat

    在线XML/JSON互相转换工具:
    http://tools.jb51.net/code/xmljson

    json代码在线格式化/美化/压缩/编辑/转换工具:
    http://tools.jb51.net/code/jsoncodeformat

    在线json压缩/转义工具:
    http://tools.jb51.net/code/json_yasuo_trans

    更多关于jQuery相关内容还可查看本站专题:《jQuery操作json数据技巧汇总》、《jQuery常用插件及用法总结》、《jQuery扩展技巧总结》及《jquery选择器用法总结》

    希望本文所述对大家jQuery程序设计有所帮助。


    上一篇:jQuery实现弹出带遮罩层并居中浮动窗口的实例

    下一篇:jquery实现的Banner广告收缩效果的实例

    相关内容

    • python3 实现的对象与json相互转换的方法及代码

      这篇文章主要介绍了python3 实现的对象与json相互转换操作,结合实例形式分析了Python3使用json模块针对json格式数据转换操作的相关实现技巧,需要的朋友可以参考下

      02-16python3 实现的对象与json相互转换操作示例

      阅读更多
    • Django接收post前端返回的json格式数据的方法

      这篇文章主要介绍了Django接收post前端返回的json格式数据代码实现,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下

      05-25Django接收post前端返回的json格式数据代码实现

      阅读更多
    • 如何解决jquery的flexigrid无法显示数据提示获取到数据问题

      升级了IE10,发现flexigrid无法显示数据,提示获取到了数据,但没任何报错任何显示,经过试验和跟踪,修改如下,有类似问题的朋友可以参考下哈

      04-19jquery的flexigrid无法显示数据提示获取到数据

      阅读更多
    • Jquery瀑布流插件的技巧用法

      瀑布流布局在目前貌似很火爆,具体的分析、原理、用到的知识等等可以看看以下几位牛人写的东西

      01-23Jquery瀑布流插件使用介绍

      阅读更多
    • 实例分享提取jquery的ready()方法

      有一些功能需求,需要在DOM载入时马上执行一些函数,但又不愿意仅为了这一个需求而引入整个JQuery库,于是就把jQuery的方法提取出来,单独使用了

      02-26提取jquery的ready()方法单独使用示例

      阅读更多
    • jQuery UI开发指南

      jQuery UI开发指南

      《jQuery UI开发指南》 是jQuery UI的快速开发指南,全面介绍jQuery UI如何改进HTML页面展示,内容包括jQuery UI 1.8版本的下列扩展特性:选项卡管理、折叠菜单、对话框、按钮、进度条、滑块、日历

      大小:6.02 MB前端开发

      点击下载
    • jQuery实战

      jQuery实战

      jQuery实战(第三版) 适用于想深入学习jQuery的Web开发人员,jQuery是互联网上流行的JavaScript框架。本书的目标是希望读者成为Web高级开发人员,无论起点如何。本书深入介绍了整个jQuery框架,此外

      大小:99.0 MBjQuery

      点击下载
    • JavaScript和jQuery实战手册

      JavaScript和jQuery实战手册

      JavaScript可以大大改进网页的动画、交互性和视觉效果,但学习该门语言不太容易。本书通过一步步引导JavaScript基础知识,展示了如何使用jQuery(即预先写好的JavaScript代码库)来节省时间和精

      大小:103 MBJavaScript

      点击下载
    • PHP与jQuery开发实例

      PHP与jQuery开发实例

      这书由浅入深地叙述了怎么使用PHP与jQuery搭建高宽比互动的Web运用。每一章聚焦点一个主题风格,探讨Web开发者常常必须处理的一类实际难题。书中以实际上范例及编码表述的方法得出了有目

      大小:9.8 MBPHP开发

      点击下载
    • Bootstrap与jQuery UI框架设计

      Bootstrap与jQuery UI框架设计

      随着各类移动终端设备的普及 之前针对PC端设计的网站已经无法满足用户的需求 响应式网页设计的概念应运而生。无论用户使用笔记本还是iPad 页面都应该能够自动切换分辨率、图片尺寸及相

      大小:180 MBjQuery

      点击下载
    • 疯狂前端开发讲义:jQuery+AngularJS+Bootstrap前端开发实战

      疯狂前端开发讲义:jQuery+AngularJS+Bootstrap前端开发实战

      大小:131.7 MB前端开发

      点击下载
    • jQuery EasyUI开发指南

      jQuery EasyUI开发指南

      使用Java开发软件的开发人员一定会接触到前端开发,而前端开发有一个流行趋势,那就是插件开发。jQuery EasyUI是目前Java Web领域流行的插件开发工具。《jQuery EasyUI开发指南》主要讲述EasyUI各种

      大小:48.4 MBjQuery

      点击下载

    学习笔记