如何用jQuery统计HTML表格forkscount列中critical值的总数

看起来你遇到的核心问题应该是数据加载时机不对，或者没正确利用DataTables的API来获取行数据。AJAX加载数据是异步操作，如果在数据还没完全渲染到表格里就执行统计代码，自然拿不到正确数值。下面给你具体的解决步骤和代码修改方案：

步骤1：整合表格初始化与数据加载回调 #

把表格初始化、AJAX数据加载和统计逻辑绑定起来，确保统计在数据完全加载后执行。修改你的script.js代码如下：

$(document).ready(function() {
    // 初始化DataTables并加载JSON数据
    var table = $('#example').DataTable({
        ajax: {
            url: "你的JSON数据地址", // 替换成实际的JSON文件路径
            dataSrc: "" // 如果JSON是直接的数组（无嵌套data字段），就填""
        },
        columns: [
            { data: "test", visible: false }, // 对应隐藏的test列
            { data: "name" },
            { data: "stargazerscount" },
            { data: "forkscount" },
            { data: "description" }
        ],
        // 表格初始化完成（数据加载完毕）后执行统计
        initComplete: function(settings, json) {
            countCriticalForks(table);
        }
    });

    // 统计forkscount为critical的函数
    function countCriticalForks(table) {
        // 获取所有行数据，过滤出forkscount等于'critical'的行
        var criticalCount = table.rows().data().filter(function(row) {
            return row.forkscount === 'critical';
        }).length;

        // 输出结果到控制台，也可以更新页面元素显示
        console.log("Critical总数：", criticalCount);
        // 比如把数值显示到页面的critical-box里
        $('#critical').text("Critical: " + criticalCount);
    }
});

步骤2：关键细节说明 #

• 异步处理：通过initComplete回调确保统计逻辑在数据完全渲染到表格后执行，这是解决你之前拿不到正确数值的核心。
• DataTables API使用：table.rows().data()能获取表格所有行的原始数据，用filter方法筛选符合条件的行后，取length就是目标总数。
• 列字段匹配：columns配置里的data值要和你JSON数据里的字段名完全一致，否则数据无法正确绑定到表格。

额外调试技巧 #

如果还是有问题，可以在initComplete里先打印加载的JSON数据，确认forkscount字段值确实是'critical'（字符串匹配严格区分大小写）：

initComplete: function(settings, json) {
    console.log("加载的JSON数据：", json);
    countCriticalForks(table);
}

这样就能准确拿到你需要的11个critical的总数啦。

内容的提问来源于stack exchange，提问作者A prasad