JS 遍历 json 和 JQuery 遍历json操作完整示例


Posted in jQuery onNovember 11, 2019

本文实例讲述了JS 遍历 json 和 JQuery 遍历json操作。分享给大家供大家参考,具体如下:

json 遍历

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>demo data</title>
    <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
  </head>
  <body>
    <script>
      var json = {
        "test1" :  "data1",
        test2  :  "data2"
      };
      //jquery 其中i 是键名 v 是键值
      $.each(json,function(i,v){
        console.log(i + " =============== " + v);
      })
      //javascript 遍历 i 是键名 json[i] 是键值
      var json = {
        "test1" :  "data1",
        test2  :  "data2"
      };
      for(i in json)
      {
        console.log(i + "  ======================== " + json[i]);
      }
    </script>
  </body>
</html>

运行结果:

JS 遍历 json 和 JQuery 遍历json操作完整示例

根据json键值 获得 json键名

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>demo data</title>
  </head>
  <body>
    <script>
      var data = {
        "test1" :  "data1",
        test2  :  "data2"
      };
      /**
       * @param json 需要检索的json对象
       * @void value 检索的值
       * @return 检索的值对应的键名
       */
      function getKeyName(json,value)
      {
        for(i in json)
        {
          if(json[i] == value)
          {
            return i;
          }
        }
      }
      console.log(getKeyName(data,"data2"));
    </script>
  </body>
</html>

运行结果:

JS 遍历 json 和 JQuery 遍历json操作完整示例

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

jQuery 相关文章推荐
jquery插件制作 自增长输入框实现代码
Aug 17 jQuery
详解如何在 vue 项目里正确地引用 jquery 和 jquery-ui的插件
Jun 01 jQuery
jquery dataTable 后台加载数据并分页实例代码
Jun 07 jQuery
jQuery Collapse1.1.0折叠插件简单使用
Aug 28 jQuery
Vue引入jquery实现平滑滚动到指定位置
May 09 jQuery
jQuery实现的简单对话框拖动功能示例
Jun 05 jQuery
jQuery实现侧边栏隐藏与显示的方法详解
Dec 22 jQuery
使用异步controller与jQuery实现卷帘式分页
Jun 18 jQuery
jQuery实现简单弹幕效果
Nov 28 jQuery
jquery实现手风琴案例
May 04 jQuery
js和jquery判断数据类型的4种方法总结
Aug 28 jQuery
jQuery实现增删改查
Dec 22 jQuery
javascript/jquery实现点击触发事件的方法分析
Nov 11 #jQuery
jquery ajax 请求小技巧实例分析
Nov 11 #jQuery
jQuery利用cookie 实现本地收藏功能(不重复无需多次命名)
Nov 07 #jQuery
jQuery实现form表单基于ajax无刷新提交方法实例代码
Nov 04 #jQuery
jQuery鼠标滑过横向时间轴样式(代码详解)
Nov 01 #jQuery
jQuery高级编程之js对象、json与ajax用法实例分析
Nov 01 #jQuery
Javascript和jquery在selenium的使用过程
Oct 31 #jQuery
You might like
Windows中安装Apache2和PHP4权威指南
2006/11/18 PHP
Zend framework处理一个http请求的流程分析
2010/02/08 PHP
linux命令之调试工具strace的深入分析
2013/06/03 PHP
PHP对表单提交特殊字符的过滤和处理方法汇总
2014/02/18 PHP
php5.3以后的版本连接sqlserver2000的方法
2014/07/28 PHP
PHP查看SSL证书信息的方法
2016/09/22 PHP
Laravel如何同时连接多个数据库详解
2019/08/13 PHP
JavaScript 指导方针
2007/04/05 Javascript
jQuery 中关于CSS操作部分使用说明
2007/06/10 Javascript
javascript encodeURI和encodeURIComponent的比较
2010/04/03 Javascript
JavaScript对象之间的转换 jQuery对象和原声DOM
2011/03/07 Javascript
利用jQuery简单实现产品展示图片左右滚动功能(示例代码)
2014/01/02 Javascript
jQuery获取checkboxlist的value值的方法
2015/09/27 Javascript
javascript 常用验证函数总结
2016/06/28 Javascript
Google 地图获取API Key详细教程
2016/08/06 Javascript
ionic中列表项增加和删除的实现方法
2017/01/22 Javascript
Vue中添加手机验证码组件功能操作方法
2017/12/07 Javascript
基于打包工具Webpack进行项目开发实例
2018/05/29 Javascript
Vue实现PC端靠边悬浮球的代码
2020/05/09 Javascript
weui上传多图片,压缩,base64编码的示例代码
2020/06/22 Javascript
详谈Vue.js框架下main.js,App.vue,page/index.vue之间的区别
2020/08/12 Javascript
python&amp;MongoDB爬取图书馆借阅记录
2016/02/05 Python
python中使用%与.format格式化文本方法解析
2017/12/27 Python
好的Python培训机构应该具备哪些条件
2018/05/23 Python
Python3字符串encode与decode的讲解
2019/04/02 Python
基于python3抓取pinpoint应用信息入库
2020/01/08 Python
HTML5中Canvas与SVG的画图原理比较
2013/01/16 HTML / CSS
应聘护士自荐信
2013/10/21 职场文书
医院护士的求职信范文
2013/12/26 职场文书
建筑设计学生的自我评价
2014/01/16 职场文书
大学生国庆节65周年演讲稿范文
2014/09/25 职场文书
一份教室追逐打闹的检讨书
2014/09/27 职场文书
幼儿园中班教师个人工作总结
2015/02/06 职场文书
遗嘱范文
2015/08/07 职场文书
python自动化调用百度api解决验证码
2021/04/13 Python
Golang Elasticsearches 批量修改查询及发送MQ
2022/04/19 Golang