其内容

Question

所有正确的精确匹配选择元素，我不知道是否有一种方法可以使:contains() jQuery的选择器选择与仅是在

输入例如字符串元素 -

<p>hello</p> 
<p>hello world</p> 

$('p:contains("hello")').css('font-weight', 'bold'); 

选择器将选择两个p元素并使它们变为粗体，但我希望它只选择第一个。

Answer 1

不，没有这样做的jQuery（或CSS）选择器。

你可以很容易地使用filter：

$("p").filter(function() { 
    return $(this).text() === "hello"; 
}).css("font-weight", "bold"); 

这不是一个选择，但它的工作。 :-)

如果你想之前或之后办理的空白“你好”，你可以在那里扔一个$.trim：

return $.trim($(this).text()) === "hello"; 

对于过早的优化在那里，如果你不关心它不匹配<p><span>hello</span></p>和类似的，你可以直接使用innerHTML避免$和text来电：

return this.innerHTML === "hello"; 

...但你必须有一个很多它的重要段落，很多，你可能会首先遇到其他问题。 :-)

Answer 2

你可以使用jQuery的filter()函数来实现这一点。

$("p").filter(function() { 
// Matches exact string 
return $(this).text() === "Hello World"; 
}).css("font-weight", "bold"); 

Answer 3

的。首先（）将在这里帮助

$('p:contains("hello")').first().css('font-weight', 'bold'); 

Answer 4

尝试添加一个扩展伪功能：

$.expr[':'].textEquals = $.expr.createPseudo(function(arg) { 
    return function(elem) { 
     return $(elem).text().match("^" + arg + "$"); 
    }; 
}); 

然后，你可以这样做：

$('p:textEquals("Hello World")'); 

Answer 5

所以Amandu的答案主要是作品。然而，在野外使用它，我遇到了一些问题，我预计会发现的事情没有找到。这是因为有时在元素的文本周围会出现随机的空白区域。我相信，如果你正在寻找“Hello World”，你仍然希望它匹配“Hello World”，甚至是“Hello World \ n”。因此，我只是将“trim（）”方法添加到该函数中，该函数移除了周围的空白，并且它开始工作得更好。

具体...

$.expr[':'].textEquals = function(el, i, m) { 
    var searchText = m[3]; 
    var match = $(el).text().trim().match("^" + searchText + "$") 
    return match && match.length > 0; 
} 

此外，请注意，这个答案是非常相似 Select link by text (exact match)

和二级注...trim仅在前后删除空白搜索文本。它不会删除单词中间的空格。我相信这是可取的行为，但如果你愿意，你可以改变。

Answer 6

像T.J. Crowder在上面说过，过滤功能确实有奇效。在我的具体情况下，它不适合我。我需要在div内搜索多个表和它们各自的td标签（在本例中为jQuery对话框）。

$("#MyJqueryDialog table tr td").filter(function() { 
    // The following implies that there is some text inside the td tag. 
    if ($.trim($(this).text()) == "Hello World!") { 
     // Perform specific task. 
    } 
}); 

我希望这对某人有帮助！

Answer 7

我发现了一种适用于我的方法。它不是100％确切的，但它消除了所有包含的字符串不仅仅包含我正在查找的单词，因为我检查了不包含单独空格的字符串。顺便说一下，你不需要这些“”。 jQuery知道你正在寻找一个字符串。确保在：contains（）部分只有一个空格，否则它将不起作用。

<p>hello</p> 
<p>hello world</p> 
$('p:contains(hello):not(:contains())').css('font-weight', 'bold'); 

是的，我知道你有没有这样的东西<p>helloworld</p>