如何根據jQuery中所有元素的內容選擇元素？

Question

我有一系列的<div/> ，如下所示：

<div>.co.uk</div>  
<div>.com</div>  
<div>.gb.com</div>  
<div>.uk.com</div>  
<div>.net</div>

如何僅選擇包含.co.uk ， .com ， .net的div。

如果我使用：

$('div:contains(".co.uk"), div:contains(".com"), div:contains(".net")`)

這.gb.com導致同時選擇.gb.com和.uk.com div。

Answer 1

您可以使用filter方法檢查內容：

$('div').filter(function(){
  var t = $(this).text();
  return t == '.co.uk' || t == '.com' || t == '.net';
})

您可能仍然希望在選擇器中清除盡可能多的元素，以減少過濾器功能必須檢查的元素數量。 即使contains偽類無法完全匹配，它仍然可以用於減少結果：

$('div:contains(".co.uk"), div:contains(".com"), div:contains(".net")`).filter(function(){
  var t = $(this).text();
  return t == '.co.uk' || t == '.com' || t == '.net';
})

Answer 2

最好的選擇是使用.each()遍歷div，並通過檢查$(this).text()來檢查回調中的內容：

$('div').each(function() {
    if ($(this).text().match(/^\.(com|net|co\.uk)$/)) {
        // ...
    }
});

Answer 3

我會用過濾器做到這一點：

jQuery.fn.pickDomains = function() {
  var domains = jQuery.makeArray(arguments);
  return this.filter(function(_, element) {
    for (var d = 0; d < domains.length; ++d)
      if (domains[d] == $(element).text()) return true;
    return false;
  });
};

然后，您可以說類似以下內容：

var theDivs = $('div.whatever').pickDomains('.co.uk', '.com', '.net');

Answer 4

我也多次遇到過這個問題，特別是因為我正在使用存在StartsWith函數的 Prototype中進行開發。 可能只有遍歷div和檢查子字符串的方法，可以在前面的類似問題上找到代碼。