从 json 文件解析的 html 表中过滤数据答案

【问题标题】：Filter data from html table parsed from json file从 json 文件解析的 html 表中过滤数据
【发布时间】：2017-08-03 19:14:55
【问题描述】：

我有一个 html 文件，它创建一个从 json 文件填充的表。这是示例：

这是 JSON：

我想在页面顶部添加一个过滤器，您可以在其中选择您感兴趣的值，然后在同一个表格中相应地显示结果。

但我不知道如何做到这一点（尽可能简单，不使用插件）。

有什么建议或指示吗？

【问题讨论】：

过滤器将是具有可能值的复选框（它们在 JSON 文件中重复）。
所以你想预读 JSON 文件，填充每个标题下的复选框，然后在用户从复选框中选择时进行过滤？
@rasmeister 例如，在“Runs On”列中，可能的选项有 4 种不同。所以我希望用户在过滤时使用复选框选择他/她想要的所有选项，然后点击按钮应用/提交过滤器，结果将根据过滤器的配置显示。过滤器将是一个尚未实现的单独部分。
因此需要完成许多孤立的事情。读取 JSON 以提供选项列表，在 UI 中显示这些选项，收集用户选择，过滤并显示结果。我建议您依次解决每一个问题，并在遇到障碍时寻求更具体的帮助。否则，您是在要求某人为您编写代码，这通常意味着您不会得到进一步的答复，因为问题太宽泛了。

【解决方案1】：

我会在用户输入名称的地方放置一个输入框，然后在用户点击“过滤器”按钮时添加一些脚本：

function filterByName(list, name) {
  return list.filter(function(item) {
    return (item.Name === name); 
  }
}

【讨论】：