如何选择与另一个有某种关系的某个表格单元格？答案

【问题标题】：How to select a certain table cell in certain relation to another?如何选择与另一个有某种关系的某个表格单元格？
【发布时间】：2015-02-20 19:55:07
【问题描述】：

我有

<table>
    <tbody>
        <tr>
            <th colspan="2">Infobox</th>
        </tr>
        <tr>
            <td>Lorem ipsum ...</td>
            <td>Lorem ipsum ...</td>
        </tr>
        ⁞
        <tr>
            <td>Lorem ipsum ...</td>
            <td>Lorem ipsum ...</td>
        </tr>
        <tr>
            <th colspan="2">[random stuff]</th>
        </tr>
        <!-- *** Where I want to add another row *** -->
        <tr>
            <td>Lorem ipsum ...</td>
            <td>Lorem ipsum ...</td>
        </tr>
        ⁞

选择和附加我的附加行的最优雅/最有效的方法是什么？我已经开始了

$("table th:contains('Infobox')").closest('tbody th[colspan="2"]');

但这并没有选择我想要的。感谢您的帮助和圣诞快乐 :o)

【问题讨论】：

喜欢这个jsfiddle.net/j08691/gab0kLzs?
最优雅的方式是使用Angular。
谢谢 j08691，这正是我想要的。伟大的！你为什么不把它放在一个答案中，这样我就可以感激地评价你并结束这个问题？

标签： javascript html jquery-selectors

【解决方案1】：

.after 呢？

$("table th:contains('Infobox')").after("<tr></tr>")

这将在选择器之后附加 HTML。

【讨论】：

这是针对错误的元素：jsfiddle.net/TrueBlueAussie/y80gzL4k/1 请注意他们想要插入新内容的位置。例如Where I want to add another row

【解决方案2】：

您当前的查询正在尝试使用closest 向上和向下搜索 DOM。 closest 只搜索祖先。

您希望如何定位正确的表有点模糊，但按照您的示例，您会想要这样的东西：http://jsfiddle.net/TrueBlueAussie/y80gzL4k/2/

 $('table th:contains("Infobox")')
    .closest('tbody')
    .find('tr:has(th[colspan="2"]):last')
    .after("<tr><th>New row goes here</th></tr>");

【讨论】：