从 JavaScript/Jquery 中的动态数组更新表头

Question

这是我的更新函数，用于从我从选中的复选框中收集的动态数组更新表标题，现在当我单击按钮调用此函数时，我想更新我的表标题但是发生了什么新的更新的数组元素附加了以前的标题，单击按钮时我想根据新数组更新表标题？如果需要，请要求澄清。跳过前 3 行并使用 arr1 作为数组来创建表头。

    <script>
    function updateTable() {
    /*var arr1 = [];  //this is the array
    $.each($("input[name='cols']:checked"), function (){
        arr1.push($(this).val());
    });*/
    var arr1 = ["a", "b", "c", "d"];
    // First create thead section
    $('#dispTab').append('<thead><tr></tr></thead>');
    // Then create your head elements
    $thead = $('#dispTab > thead > tr:first');
    for (var i = 0, len = arr1.length; i < len; i++) {
        $thead.append('<th>'+arr1[i]+'</th>');
    }
    }
    </script>

Answer 1

尝试html()而不是append()

如下所示

 $thead.find("th").eq(i).html(arr1[i]);