Javascript 如何通过css或xpath选择器将html表头单元格映射到行单元格？

因此，我的数据结构与第页类似：

<!-- some html-->
<table>
    <thead>
    <tr>
        <th>Date</th><th>Type</th><th>Value</th> <!-- Header I need -->
    </tr>
    </thead>
</table>
<!-- some html-->
<table>
    <tbody>
        <tr id="insertGuidHere">
            <td>eventDate</td><td>eventType</td><td>eventData</td> <!-- Values I need to map -->
        </tr>
    </tbody>
</table>

---

我知道jQuery中有一个

.index（）

函数，但我无法让它正常运行，即返回一个数字。

在HTML表DOM中，一个单元格有一个属性

cellIndex

（以0开头），因此您可以使用

x.cellIndex+1

来查找XPath的索引。然后可以在XPath中使用

“id（'insertGuidHere'）/td[“+（x.cellIndex+1）+”]”

来选择第三个单元格。当然，这也将与例如

//tbody/tr/td[3]

一起工作，以选择所有行的所有第三个单元格

var x = $x("//th[contains(text(),'Value')]")[0].findIndexAmongSiblings(); // returns 3, because it's 3rd header cell
$("tr#insertGuidHere > td:nth-child(" + x + ")"); // returns eventData cell