javascript - 为什么 jQuery 的 :contains count unexpected in my code?

Question

我有一个带有两个参数的函数:第一个是要计数的字符串，第二个是 HTML 元素的 id，该函数应该在该元素中计算该字符串的出现次数。

function countString(searchString, elementToSearchIn) {
    return $("#"+elementToSearchIn+" *:contains("+searchString+")").length;
    // In this example, call will be $("#searchElement *:contains('Apple')").length;
}

<table id="searchElement" border="1">
  <tr>
    <th>Apple</th>
    <th>Apple</th>
    <th>Banana</th>
  </tr>
  <tr>
    <td>Apple</td>
    <td>Orange</td>
    <td>Banana</td>
  </tr>
</table>

我设置了一个小 fiddle 来演示该问题:例如，我的 table 中有 3 次“Apple”，但 countString 返回 6。

为什么我的函数没有返回正确的计数？

https://jsfiddle.net/v10swbff/

Answer 1

问题是 *:contains 与 TD、TH AND TR 匹配。因此计数为 6(每个 TR 一个，然后计数预期的 TH 和 TD)。要修复此问题，您可以分别检查 TH 和 TD，如下所示:

function countString(searchString, elementToSearchIn) {
    var thCount = $("#"+elementToSearchIn+" th:contains("+searchString+")").length;
    var tdCount = $("#"+elementToSearchIn+" td:contains("+searchString+")").length;
    return thCount + tdCount;
}

更新了 JSFiddle:https://jsfiddle.net/v10swbff/1/