Javascript a<；td>；在a<；tr>；

我试图找到这是

中

的顺序。我有一个这样的桌子结构

<table>
    <tbody>
        <tr>
            <th> Name </th>
            <th> Edit </th>
            <th> Delete </th>
        <tr>

        <tr>
            <td> Tom </td>
            <td> <i class="icon icon_edit"></i> </td>
            <td> <i class="icon icon_remove"></i> </td>
        <tr>
    <tbody>
</table>

如何在jQuery中实现这一点

var tdIndex=$('.icon_edit').parent('td').index();

$("table th:eq('"+ tdIndex+"')");

尝试使用，我建议您使用

试着用，我建议你用

jQuery有一个方法，它是基于零的，但是

eq（）

jQuery有一个方法，它是基于零的，但是

eq（）

---

我宁愿在标题上使用一个类，因为如果有一天更改列的顺序，您的Javascript可能会忘记更新，因此将不再工作

下面是我要做的：

<table>
    <thead>
        <tr>
            <th>Name</th>
            <th class="edit-header">Edit</th>
            <th>Delete</th>
        <tr>
    </thead>

    <tbody>
        <tr>
            <td>Tom</td>
            <td class="edit"><i class="icon icon_edit"></i></td>
            <td><i class="icon icon_remove"></i></td>
        <tr>
    <tbody>
</table>

---

我还在编辑单元格中添加了

edit

类，因为图标类名可能也会更改。

我更愿意在标题中使用类，因为如果有一天更改列的顺序，您的Javascript可能会忘记更新，因此将不再工作

下面是我要做的：

<table>
    <thead>
        <tr>
            <th>Name</th>
            <th class="edit-header">Edit</th>
            <th>Delete</th>
        <tr>
    </thead>

    <tbody>
        <tr>
            <td>Tom</td>
            <td class="edit"><i class="icon icon_edit"></i></td>
            <td><i class="icon icon_remove"></i></td>
        <tr>
    <tbody>
</table>

我也在编辑单元中添加了

edit

类，因为图标类名称也可能会更改

var parentTD            = $('.icon_edit').closest('td')
var positionOfparentTD  = parentTD.index(); // 1
var correspondingHeader = $("table th:eq("+positionOfparentTD+")")

<table>
    <thead>
        <tr>
            <th>Name</th>
            <th class="edit-header">Edit</th>
            <th>Delete</th>
        <tr>
    </thead>

    <tbody>
        <tr>
            <td>Tom</td>
            <td class="edit"><i class="icon icon_edit"></i></td>
            <td><i class="icon icon_remove"></i></td>
        <tr>
    <tbody>
</table>

var $editHeader = $('.edit').parents('thead').find('.edit-header');