使用 prevAll select 包含关键字的 table 的所有部分

Question

这是 jsFiddle 和相关的 table HTML。

我想使用 jQuery 突出显示或删除 table 中包含特定关键字的部分。

<table>
    <tr class="mark"></tr>
    <tr><td>apple</td></tr>
    <tr><td>1</td></tr>
    <tr><td>2</td></tr>
    <tr><td>3</td></tr>
    <tr><td>4</td></tr>
    <tr><td>5</td></tr>

    <tr class="mark"></tr>
    <tr><td>pear</td></tr>
    <tr><td>1</td></tr>
    <tr><td>2</td></tr>
    <tr><td>3</td></tr>
    <tr><td>4</td></tr>
    <tr><td>5</td></tr>

    <tr class="mark"></tr>
    <tr><td>apple</td></tr>
    <tr><td>1</td></tr>
    <tr><td>2</td></tr>
    <tr><td>3</td></tr>
    <tr><td>4</td></tr>
    <tr><td>5</td></tr>

    <tr class="mark"></tr>
    <tr><td>pear</td></tr>
    <tr><td>1</td></tr>
    <tr><td>2</td></tr>
    <tr><td>3</td></tr>
    <tr><td>4</td></tr>
    <tr><td>5</td></tr>

    <tr class="mark"></tr>
    <tr><td>apple</td></tr>
    <tr><td>1</td></tr>
    <tr><td>2</td></tr>
    <tr><td>3</td></tr>
    <tr><td>4</td></tr>
    <tr><td>5</td></tr>

    <tr class="mark"></tr>
    <tr><td>pear</td></tr>
    <tr><td>1</td></tr>
    <tr><td>2</td></tr>
    <tr><td>3</td></tr>
    <tr><td>4</td></tr>
    <tr><td>5</td></tr>

    <tr class="mark"></tr>
    <tr><td>apple</td></tr>
    <tr><td>1</td></tr>
    <tr><td>2</td></tr>
    <tr><td>3</td></tr>
    <tr><td>4</td></tr>
    <tr><td>5</td></tr>
</table>

现在，我可以使用

$("td:contains('pear')").parent().prev().nextUntil(".mark").css("background-color", "red");

完成我想做的事情（突出显示包含 "pear" 的所有部分，由 === 分隔）。但是，对于分隔符行不直接位于我正在搜索的文本之前的情况，我如何使用 prevAll 执行此操作？我尝试了 $("td:contains('pear')").parent().prevAll(".mark:first").nextUntil(".mark").css("background-color", "red");，我认为应该可以，但只有一个部分被突出显示。我想我缺少关于 jQuery 如何处理我想将 prevAll() 之类的操作映射到元素列表的情况的关键理解。

请忽略糟糕的table布局；这就是我必须使用的 T_T

Answer 1

这应该有效：

$("td:contains('pear')").parent().each(function() {
  $(this).prevAll(".mark:first").nextUntil(".mark").css("background-color", "red");
});

参见：https://jsfiddle.net/aszepeshazi/9czm7g3y/2/

使用 prevAll select 包含关键字的 table 的所有部分

Using prevAll to select all sections of a table containing a keyword

jquery

jquery-selectors

jquery-traversing