使用jquery从数组创建表头

Question

这是我的小提琴

我想做的是用jquery创建这个:

   <thead>
    <tr>
        <th>DeviceName</th><th>counter1</th><th>counter2</th><th>counter3</th><th>counter4</th> 
    </tr>
  </thead> 

并将其附加到

       <table id="counterTableDomId3" class="display">
       <table>    

但恐怕我的能力相当有限。这是我目前想到的。

//this is the array 
arr1=["DeviceName", "counter1", "counter2", "counter3", "counter4"];
        $('#counterTableDomId3').append($div3)
        //want to then append to <tr> and iterate through the array 

Answer 1

可以遍历数组，为数组中的每个元素创建一个th:

// First create your thead section
$('#counterTableDomId3').append('<thead><tr></tr></thead>');
// Then create your head elements
$thead = $('#counterTableDomId3 > thead > tr:first');
for (var i = 0, len = arr1.length; i < len; i++) {
    $thead.append('<th>'+arr1[i]+'</th>');
}

这是一个更新的小提琴:http://jsfiddle.net/99f6ns5o/7/