Question

我有一张桌子

<table id="table1">
  <tr class="fixedHeader">
    <td>Head1</td>
    <td>Head2</td>
    <td>Head3</td>
    <td>Head4</td>
  </tr>
  <tr>
    <td>1</td>
    <td>2</td>
    <td>3</td>
    <td>4</td>
  </tr>
  <tr>
    <td>2</td>
    <td>3</td>
    <td>5</td>
    <td>6</td>
  </tr>
</table>

我需要将tr移动到tbody，但具有fixedheader类的tr除外。我只需要在javascript或jquery中执行此操作。

任何帮助人员

Answer 1

实际上，浏览器会为您执行此操作：它会将<tr>，thead或tfooter中不包含的所有tbody包装到tbody中。所以你需要做的是：

var $thead = $('<thead>').append($("tr.fixedHeader")).prependTo($('#table1'));

Answer 2

使用classList.contains通过javascript检查类是否存在

<script>
var table = document.getElementById('table1');    
var tbd = document.getElementsByTagName("tbody")[0];  
var thead = document.createElement("thead");
table.appendChild(thead);
for(var i=0;i<table.rows.length;i++) {
var trs = table.getElementsByTagName("tr")[i];    
var tr_class = trs.classList.contains("fixedHeader"); //return true when class exit if not return false
if(!tr_class){           
    tbd.appendChild(trs);
}
else{
    thead.appendChild(trs);
}
}       
</script>

如何使用javascript将tr移动到tbody？

2 个答案: