Question

我有一个格式如下的HTML表： -

+------+----------+----------+----------+
| name | subject1 | subject2 | subject3 |
+------+----------+----------+----------+
| xxx  | pass     | fail     | pass     |
| yyy  | pass     | pass     | pass     |
| zzz  | pass     | fail     | fail     |
+------+----------+----------+----------+

使用从服务器获取的json数据动态创建表。我创建了每个包含主题名称的名称标签，因为主题的数量不是常数。现在，我想做的是拥有与主题相对应的列表..说subject1 []，2等等，这些列表将包含与该主题相关的通过/失败列表......然后我可以计算通过的数量/对于那些科目失败并绘制图表。

虽然我知道这个：可以用来获取特定列的所有行，

$('#mytable tbody td:nth-col(4)')

如果列数固定，这将不会有用。请告诉我如何使用jquery / JS完成此任务。修改 data.json :-(如果可以解析）

{"students": [{"student": John, "status": "pass", "subject": "english"},{"student": Joe, "status": "pass", "subject": "english"},{"student": Jill, "status": "fail", "subject": "french"}]}

Answer 1

我使用包含主题名称的名称标签创建每个

当您在创建的所有元素中提及名称标签时，您可以使用以下选择器：

$("[name='subject1']")

这将返回名称属性中包含subject1的所有元素。

而不是name属性，如果您使用data-subject并将主题名称存储在该特定单元格中，则

$("[data-subject='subject1']")

这将返回包含subject1的所有单元格。

Answer 2

正如评论中所讨论的，从原始源（在这种情况下是一个JavaScript对象）聚合数据要容易得多，而不是从它的可视化表示（在这种情况下是DOM）中提取数据。

根据每个学生数据的subject对数据进行分组：

var res = {};

for (var i in data.students)
{
    var item = data.students[i];
    var subject = item.subject;

    if (!res[subject])
        res[subject] = { passedCount: 0, failedCount: 0 };

    if (item.status == 'pass')
        res[subject].passedCount++;
    else
        res[subject].failedCount++;
}

请参阅Fiddle

按列名获取所有条目：HTML表

2 个答案: