如何在 JavaScript 或 jQuery 中过滤 JSON 数据？

IT技术 javascript jquery json
2021-02-10 14:04:15

如何使用 Javascript 或 jQuery 过滤 JSON 数据？

这是我的 JSON 数据：

[{"name":"Lenovo Thinkpad 41A4298","website":"google"},
{"name":"Lenovo Thinkpad 41A2222","website":"google"},
{"name":"Lenovo Thinkpad 41Awww33","website":"yahoo"},
{"name":"Lenovo Thinkpad 41A424448","website":"google"},
{"name":"Lenovo Thinkpad 41A429rr8","website":"ebay"},
{"name":"Lenovo Thinkpad 41A429ff8","website":"ebay"},
{"name":"Lenovo Thinkpad 41A429ss8","website":"rediff"},
{"name":"Lenovo Thinkpad 41A429sg8","website":"yahoo"}]

JavaScript：

obj1 = JSON.parse(jsondata);

现在我只想要包含网站的名称和网站数据等于“雅虎”

6个回答

这就是你应该这样做的方式：（对于谷歌查找）

$([
  {"name":"Lenovo Thinkpad 41A4298","website":"google222"},
  {"name":"Lenovo Thinkpad 41A2222","website":"google"}
  ])
    .filter(function (i,n){
        return n.website==='google';
    });

更好的解决方案：（萨尔曼的）

$.grep( [{"name":"Lenovo Thinkpad 41A4298","website":"google"},{"name":"Lenovo Thinkpad 41A2222","website":"google"}], function( n, i ) {
  return n.website==='google';
});

http://jsbin.com/yakubixi/4/edit

@RoyiNamir HI..... 可能获得两个网站列表，如：return n.website==='Google' || n.website==='雅虎'
2021-03-21 14:04:15
从返回值.each将不工作（假可以返回到终止循环，但也差不多了）。
2021-04-04 14:04:15
@Me7888 你是问还是说？
2021-04-07 14:04:15
@RoyiNamir var as=$(temp).filter(function (i,n){return n.website==='Google'});alert(as);
2021-04-08 14:04:15
@Me7888 是的。没错。假设 json 是一个对象。（不是它的字符串表示）。
2021-04-08 14:04:15

除非您针对旧浏览器并且不想使用垫片，否则不需要 jQuery。

var yahooOnly = JSON.parse(jsondata).filter(function (entry) {
    return entry.website === 'yahoo';
});

在 ES2015 中：

const yahooOnly = JSON.parse(jsondata).filter(({website}) => website === 'yahoo');
我认为它实际上得到了广泛的支持（旧的 IE 在 XP 上运行，无论如何都已停产）。因此链接。此外，包含一个 shim 比包含整个 jQuery 好得多。
2021-03-27 14:04:15
@RoyiNamir 请阅读我回答的开头。顺便说一句：caniuse.com/#search=filter
2021-03-30 14:04:15
过滤器没有得到广泛支持（正如你提到的）
2021-04-03 14:04:15
他从来没有说过他已经在页面上使用了 jQuery。问题是 JavaScript还是jQuery。无论如何，jQuery 本身就是多余的。
2021-04-04 14:04:15
那好吧。（我不是downvoter :-)） ps 为什么链接？我已经知道它在较旧的 Ie 中没有得到广泛支持
2021-04-05 14:04:15

以下代码对我有用：

var data = [{"name":"Lenovo Thinkpad 41A4298","website":"google"},
{"name":"Lenovo Thinkpad 41A2222","website":"google"},
{"name":"Lenovo Thinkpad 41Awww33","website":"yahoo"},
{"name":"Lenovo Thinkpad 41A424448","website":"google"},
{"name":"Lenovo Thinkpad 41A429rr8","website":"ebay"},
{"name":"Lenovo Thinkpad 41A429ff8","website":"ebay"},
{"name":"Lenovo Thinkpad 41A429ss8","website":"rediff"},
{"name":"Lenovo Thinkpad 41A429sg8","website":"yahoo"}]

var data_filter = data.filter( element => element.website =="yahoo")
console.log(data_filter)

它现在按预期工作。谢谢你的纠正。
2021-04-01 14:04:15
此代码不会按“雅虎”过滤数据。它将它们全部更改为“雅虎”。问题是如何获取网站等于“雅虎”的数据。
2021-04-06 14:04:15
@probitaille 感谢您的提醒。我更正了代码。
2021-04-06 14:04:15

试试这种方式，让你甚至可以按其他键过滤

数据：

var my_data = [{"name":"Lenovo Thinkpad 41A4298","website":"google"},
{"name":"Lenovo Thinkpad 41A2222","website":"google"},
{"name":"Lenovo Thinkpad 41Awww33","website":"yahoo"},
{"name":"Lenovo Thinkpad 41A424448","website":"google"},
{"name":"Lenovo Thinkpad 41A429rr8","website":"ebay"},
{"name":"Lenovo Thinkpad 41A429ff8","website":"ebay"},
{"name":"Lenovo Thinkpad 41A429ss8","website":"rediff"},
{"name":"Lenovo Thinkpad 41A429sg8","website":"yahoo"}];

用法：

//We do that to ensure to get a correct JSON
var my_json = JSON.stringify(my_data)
//We can use {'name': 'Lenovo Thinkpad 41A429ff8'} as criteria too
var filtered_json = find_in_object(JSON.parse(my_json), {website: 'yahoo'});

过滤功能

function find_in_object(my_object, my_criteria){

  return my_object.filter(function(obj) {
    return Object.keys(my_criteria).every(function(c) {
      return obj[c] == my_criteria[c];
    });
  });

}
伟大的工作，如果我想在这一行中传递 2 个或更多过滤器怎么办：“varfiltered_json = find_in_object(JSON.parse(my_json), {website: 'yahoo'});”
2021-03-31 14:04:15

您可以使用jQuery 每个函数，如下所述：

定义您的数据：

var jsonStr = '[{"name":"Lenovo Thinkpad 41A4298,"website":"google"},{"name":"Lenovo Thinkpad 41A2222,"website":"google"},{"name":"Lenovo Thinkpad 41Awww33,"website":"yahoo"},{"name":"Lenovo Thinkpad 41A424448,"website":"google"},{"name":"Lenovo Thinkpad 41A429rr8,"website":"ebay"},{"name":"Lenovo Thinkpad 41A429ff8,"website":"ebay"},{"name":"Lenovo Thinkpad 41A429ss8,"website":"rediff"},{"name":"Lenovo Thinkpad 41A429sg8,"website":"yahoo"}]';

将 JSON 字符串解析为 JSON 对象：

var json = JSON.parse(jsonStr);

迭代和过滤：

$.each(JSON.parse(json), function (idx, obj) {
    if (obj.website == 'yahoo') {
        // do whatever you want
    }
});
其它你可能感兴趣的问题
上一篇是否可以通过 JavaScript 触发链接（或任何元素）的点击事件？ 下一篇如何将内联 svg（在 DOM 中）绘制到画布上？