迭代標記的childred

Question

我有這個：

var thead = document.getElementById("my_table").getElementsByTagName("thead")[0];

// =>
<thead>
  <tr>
    <th ....
    <th ....
    <th ....

現在我如何通過索引選擇或找到“ th ”？ thead.children[0]返回整個“tr”， thead.children[0][0]未定義。 我怎樣才能到達“th”節點？

Answer 1

您可以使用element的children屬性來訪問元素的子元素：

var thead = document.getElementById("my_table").getElementsByTagName("thead")[0].children[0].children;

意思是

在my_table找到thead標記，獲取它的第一my_table （ tr ）並返回其子tr的數組

現在，您將能夠遍歷它們：

for (var i = 0; i < thead.length; i++)
{
    console.log(thead[i]);
}

更方便的方法是使用querySelectorAll和CSS選擇器：

var thead = document.querySelectorAll('#my_table > thead > tr > th');
for (var i = 0; i < thead.length; i++)
{
    console.log(thead[i]);
}