jQuery实现使用sort方法对json数据排序的方法


Posted in jQuery onApril 17, 2018

本文实例讲述了jQuery实现使用sort方法对json数据排序的方法。分享给大家供大家参考,具体如下:

如何对后台返回过来的json数据按照数据中的某一项进行排序呢。

首先看一下排序前的json数据:

{
  "result":[
    {
      "cid":1,
      "name":"aaa",
      "price":1000
    },{
      "cid":2,
      "name":"bbb",
      "price":150
    },{
      "cid":3,
      "name":"ccc",
      "price":200
    },{
      "cid":4,
      "name":"ddd",
      "price":1500
    },{
      "cid":5,
      "name":"eee",
      "price":1100
    }
  ],
  "totalCount":5
}

接下来,按照json中的price进行排序并打印到控制台:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title></title>
    <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
  </head>
  <body>
    <script type="text/javascript">
      //利用jquery中的get方法获取json数据
      $.get("exp.json","",function(data){
        var newdata=data.result
        //根据价格(price)排序
        function sortprice(a,b){
          return a.price-b.price
        }
        //利用js中的sort方法
        newdata.sort(sortprice);
        //打印排序后的数据到控制台
        console.log(newdata);
      })
    </script>
  </body>
</html>

这样就完成了按照price对json数据的排序,在控制台查看排序结果如下:

jQuery实现使用sort方法对json数据排序的方法

排序完成

jQuery 相关文章推荐
基于jquery实现多选下拉列表
Aug 02 jQuery
基于jQuery选择器之表单对象属性筛选选择器的实例
Sep 19 jQuery
jQuery实现倒计时功能 jQuery实现计时器功能
Sep 19 jQuery
javascript+jQuery实现360开机时间显示效果
Nov 03 jQuery
利用JQUERY实现多个AJAX请求等待的实例
Dec 14 jQuery
详解使用jQuery.i18n.properties实现js国际化
May 04 jQuery
jQuery实现的简单获取索引功能示例
Jun 04 jQuery
jquery3和layui冲突导致使用layui.layer.full弹出全屏iframe窗口时高度152px问题
May 12 jQuery
jQuery中使用validate插件校验表单功能
May 24 jQuery
Jquery实现获取子元素的方法分析
Aug 24 jQuery
jquery实现掷骰子小游戏
Oct 24 jQuery
如何基于jQuery实现五角星评分
Sep 02 jQuery
jQuery+datatables插件实现ajax加载数据与增删改查功能示例
Apr 17 #jQuery
jQuery实现带右侧索引功能的通讯录示例【附源码下载】
Apr 17 #jQuery
jQuery简单判断值是否存在于数组中的方法示例
Apr 17 #jQuery
jQuery实现文件编码成base64并通过AJAX上传的方法
Apr 12 #jQuery
jQuery实现鼠标点击处心形漂浮的炫酷效果示例
Apr 12 #jQuery
jQuery实现判断上传图片类型和大小的方法示例
Apr 11 #jQuery
[原创]jQuery实现合并/追加数组并去除重复项的方法
Apr 11 #jQuery
You might like
探讨GDFONTPATH能否被winxp下的php支持
2013/06/21 PHP
PHP使用Mysqli类库实现完美分页效果的方法
2016/04/07 PHP
验证坐标在某坐标区域内php代码
2016/10/08 PHP
PHP 图片合成、仿微信群头像的方法示例
2019/10/25 PHP
IE6下opacity与JQuery的奇妙结合
2013/03/01 Javascript
js使用html()或text()方法获取设置p标签的显示的值
2014/08/01 Javascript
JQuery实现可直接编辑的表格
2015/04/16 Javascript
js代码实现随机颜色的小方块
2015/07/30 Javascript
基于javascript实现tab选项卡切换特效调试笔记
2016/03/30 Javascript
利用jquery实现瀑布流3种案例
2016/09/18 Javascript
vuejs2.0实现一个简单的分页示例
2017/02/22 Javascript
JavaScript实现两个select下拉框选项左移右移
2017/03/09 Javascript
文本溢出插件jquery.dotdotdot.js使用方法详解
2017/06/22 jQuery
Javascript中 toFixed四舍六入方法
2017/08/21 Javascript
聊聊那些使用前端Javascript实现的机器学习类库
2017/09/18 Javascript
Angular 数据请求的实现方法
2018/05/07 Javascript
[01:08:56]DOTA2-DPC中国联赛 正赛 Magma vs LBZS BO3 第一场 2月7日
2021/03/11 DOTA
[56:38]DOTA2-DPC中国联赛正赛Aster vs Magma BO3 第一场 3月5日
2021/03/11 DOTA
详解Python中的__init__和__new__
2014/03/12 Python
Python实现的数据结构与算法之链表详解
2015/04/22 Python
TensorFlow实现卷积神经网络
2018/05/24 Python
Python Logging 日志记录入门学习
2018/06/02 Python
eclipse创建python项目步骤详解
2019/05/10 Python
Django视图、传参和forms验证操作
2020/07/15 Python
python爬取代理IP并进行有效的IP测试实现
2020/10/09 Python
html5 Canvas画图教程(11)—使用lineTo/arc/bezierCurveTo画椭圆形
2013/01/09 HTML / CSS
Diptyque英国官方网站:源自法国的知名香氛品牌
2019/08/28 全球购物
2014年自我评价
2014/01/04 职场文书
聚美优品恶搞广告词
2014/03/14 职场文书
学校综治宣传月活动总结
2014/07/02 职场文书
日语专业求职信
2014/07/04 职场文书
机关党员进社区活动总结
2014/07/05 职场文书
软弱涣散基层党组织整改方案
2014/10/25 职场文书
施工安全员岗位职责
2015/04/11 职场文书
小时代观后感
2015/06/10 职场文书
CSS中妙用 drop-shadow 实现线条光影效果
2021/11/11 HTML / CSS