使用 jquery 构建动态数据表给出错误：无法读取未定义的属性“mData”

Question

我正在手动构建一个循环一些查询结果的数据表。 我只为第一个结果附加列的名称，而对于其他我只添加内容行。 代码如下：

            for(i=0;i<simulations.length;i++ ) {
            if (i==0) {
                $("#tabella").find('thead')
                    .append($('<tr>')
                        .append("<th scope=\"col\">"+"container name"+"</th>")
                        .append("<th scope=\"col\">"+"simulation date"+"</th>")
                    )
            }
            $("#tabella").find('tbody')
                .append($('<tr>')
                    .append("<td>"+simulations[i].container_name+"</td>")
                    .append("<td>"+simulations[i].simulation_date+"</td>")
                );

            if (sessionStorage.getItem("queryFilters") != null){
                for(var name in queryFilters) {
                    if (!name.endsWith("flag")) {
                        if (i==0) {
                            $("#tabella").find('thead')
                                .find('tr')
                                .append("<th scope=\"col\">"+name.replace(/_/g, ' ')+"</th>")
                        }
                        $("#tabella").find('tbody')
                            .find('tr')
                            .append("<td>"+simulations[i][name]+"</td>")
                    }
                }
            }
        }
        $('#tabella').DataTable();

            if (sessionStorage.getItem("queryFilters") != null){
                for(var name in queryFilters) {
                    if (!name.endsWith("flag")) {
                        if (i==0) {
                            $("#tabella").find('thead')
                                .find('tr')
                                .append("<th scope=\"col\">"+name.replace(/_/g, ' ')+"</th>")
                        }
                        $("#tabella").find('tbody')
                            .find('tr')
                            .append("<td>"+simulations[i][name]+"</td>")
                    }
                }
            }
        }
        $('#tabella').DataTable();

如果结果是一行，或者删除动态列，都可以 但是，如果我在表中有两行或多行，则会出现以下错误：

jquery-3.5.1.js:4046 jQuery.Deferred exception: Cannot read property 'mData' of undefined TypeError: Cannot read property 'mData' of undefined
at HTMLTableCellElement.<anonymous> (https://cdn.datatables.net/1.10.24/js/jquery.dataTables.js:1176:15)
at Function.each (https://code.jquery.com/jquery-3.5.1.js:381:19)
at jQuery.fn.init.each (https://code.jquery.com/jquery-3.5.1.js:203:17)
at HTMLTableElement.<anonymous> (https://cdn.datatables.net/1.10.24/js/jquery.dataTables.js:1173:39)
at Function.each (https://code.jquery.com/jquery-3.5.1.js:381:19)
at jQuery.fn.init.each (https://code.jquery.com/jquery-3.5.1.js:203:17)
at jQuery.fn.init.DataTable [as dataTable] (https://cdn.datatables.net/1.10.24/js/jquery.dataTables.js:869:8)
at jQuery.fn.init.$.fn.DataTable (https://cdn.datatables.net/1.10.24/js/jquery.dataTables.js:15214:18)
at HTMLDocument.<anonymous> (http://localhost/Checks-GreenCharge/resources/js/index.js:160:27)
at mightThrow (https://code.jquery.com/jquery-3.5.1.js:3762:29) undefined
jQuery.Deferred.exceptionHook @ jquery-3.5.1.js:4046
jquery-3.5.1.js:4055 Uncaught TypeError: Cannot read property 'mData' of undefined
    at HTMLTableCellElement.<anonymous> (jquery.dataTables.js:1176)
    at Function.each (jquery-3.5.1.js:381)
    at jQuery.fn.init.each (jquery-3.5.1.js:203)
    at HTMLTableElement.<anonymous> (jquery.dataTables.js:1173)
    at Function.each (jquery-3.5.1.js:381)
    at jQuery.fn.init.each (jquery-3.5.1.js:203)
    at jQuery.fn.init.DataTable [as dataTable] (jquery.dataTables.js:869)
    at jQuery.fn.init.$.fn.DataTable (jquery.dataTables.js:15214)
    at HTMLDocument.<anonymous> (index.js:160)
    at mightThrow (jquery-3.5.1.js:3762)

也许（但我不确定）与第一行之后的“.find('tr')”有关 也许当时他找到了两个 td 元素，但现在不知道在哪里附加第 th 元素 我试图将 .last() 添加到 find() 但它不起作用...

编辑修复：我将 .last() 放在错误的位置（在广告部分）

Answer 1

编辑修复：我将 .last() 放在错误的位置（在广告部分）