javascript - jQuery:选择 tr 使所有 td 动态匹配过滤条件

Question

标题可能有点困惑，但这是我能想到的最好的。

我需要找到所有 tr 元素，其中包含与提供的过滤条件匹配的 td 元素。

这是我的例子，

<tr class="row" id="1">
    <td class="philips">PHILIPS</td>
    <td class="h4">H4</td>
    <td class="lamp">Lamp<td>
</tr>
<tr class="row" id="2">
    <td class="philips">PHILIPS</td>
    <td class="h5">H5</td>
    <td class="bulb">Bulb<td>
</tr>
<tr class="row" id="3">
    <td class="neglin">NEGLIN</td>
    <td class="w5w">W5W</td>
    <td class="tube">Tube<td>
</tr>
<tr class="row" id="4">
    <td class="philips">PHILIPS</td>
    <td class="h4">H4</td>
    <td class="bulb">Bulb<td>
</tr>
<tr class="row" id="5">
    <td class="osram">OSRAM</td>
    <td class="hb3">HB3</td>
    <td class="tube">Tube<td>
</tr>
<tr class="row" id="6">
    <td class="neglin">NEGLIN</td>
    <td class="w5w">W5W</td>
    <td class="lamp">Lamp<td>
</tr>

如果我将 filter[0] 作为“phillips”传递，结果将返回带有 id 的 tr

• 1
• 2 和
• 4

然后如果我通过第二个过滤器； filter[1] as 'h4', 结果应该过滤到

• 1 和
• 4

我试过了this question .

其中有this answer .

$('tr')
.has('td:nth-child(1):contains("Audi")')
.has('td:nth-child(2):contains("red")')
.doSomeThing();

但是，我希望动态应用我的过滤器。我怎样才能插入第三个 has 函数？

我不想采用 if-else 或 switch-case 方式，如果没有它们是可能的话。

Answer 1

你可以试试这个。

<script type="text/javascript">
    $(document).ready(function () {
        var result =  filter([".philips", ".h4"]);
        alert(result);
        var result_2 = filter([".philips"]);
        alert(result_2);
    });

    function filter(params) {
        var select = "tr";

        for (var i = 0; i < params.length; i++) {
            select += ":has(" + params[i] + ")";
        }

        return $(select).map(
              function () { 
                  return $(this).attr('id');
              }
        ).get();
    }
</script>