jQuery - 通过内部文本查找标签

I was wondering if it was possible to find a label (or any element, really) by it's inner text. For example:

我想知道是否有可能通过它的内部文本找到一个标签（或任何元素，真的）。例如：

<label for="myCheckbox">SuperSweetCheckbox</label>

And I want to find it by the text SuperSweetCheckbox.

我希望通过文本SuperSweetCheckbox找到它。

I know this seems kind of counter-intuitive, but due to the nature of the app I'm working on it seems to be necessary. I realize that I can iterate through each of the labels but I'd prefer to avoid that option if at all possible.

我知道这似乎有点违反直觉，但由于应用程序的性质，我正在努力它似乎是必要的。我意识到我可以遍历每个标签，但是如果可能的话，我宁愿避免使用该选项。

If anyone could provide some assistance, I'd appreciate it.

如果有人能提供一些帮助，我会很感激。

5 个解决方案

#1

use the selector :contains()

使用选择器：contains（）

 var element = $("label:contains('SuperSweetCheckbox')");

The matching text can appear directly within the selected element, in any of that element's descendants, or a combination thereof. As with attribute value selectors, text inside the parentheses of :contains() can be written as bare words or surrounded by quotation marks. The text must have matching case to be selected.

匹配文本可以直接出现在所选元素中，任何元素的后代中，或其组合中。与属性值选择器一样，括号内的文本：contains（）可以写成裸字或用引号括起来。文本必须具有匹配的案例才能被选中。

#2

Maybe

也许

$('label[value|="SuperSweetCheckbox"]')

according to:

根据：

http://api.jquery.com/attribute-contains-prefix-selector/

要么

$("label:contains('SuperSweet')")

according to

根据

http://api.jquery.com/contains-selector/

#3

I think the :contains() selector is what you are looking for. Check samples here > http://api.jquery.com/contains-selector/

我认为：contains（）选择器就是你要找的东西。在这里查看样品> http://api.jquery.com/contains-selector/

#4

This builds on Caspar's answer, but was too big for comments.

这建立在卡斯帕的答案之上，但对于评论来说太大了。

I thought it could be useful for others.

我认为它对其他人有用。

I used Caspar's solution but found that an empty string "" is considered to exist in any string, see:

我使用了Caspar的解决方案，但发现任何字符串中都存在空字符串“”，请参阅：

https://*.com/a/18399216/1063287.

https://*.com/a/18399216/1063287。

In my situation SuperSweetCheckbox is a dynamic value and sometimes an empty string, in which case I don't want any matching logic to occur.

在我的情况下，SuperSweetCheckbox是一个动态值，有时是一个空字符串，在这种情况下，我不希望发生任何匹配的逻辑。

Creating a pseudo function using match() seems to work, see:

使用match（）创建伪函数似乎有效，请参阅：

https://*.com/a/18462522/1063287.

https://*.com/a/18462522/1063287。

You can also use filter(), see:

你也可以使用filter（），参见：

https://*.com/a/15364327/1063287).

https://*.com/a/15364327/1063287）。

Below is an example of the three variants - :contains(), filter() and a custom function:

下面是三个变体的示例 - ：contains（），filter（）和自定义函数：

jsFiddle

的jsfiddle

jsFiddle link

jsFiddle链接

jQuery

jQuery的

var myString = "Test";

//var myString = "";

// 01.  :contains() - matches empty string as well
$("ul li > label:contains(" + myString + ")").closest("li").addClass("matched").siblings("li").addClass("notmatched");

// 02.  filter()
$("ul li > label").filter(function() {
    return $(this).text() === myString;
}).closest("li").addClass("matched").siblings("li").addClass("notmatched");

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

$("ul li > label:textEquals(" + myString + ")").closest("li").addClass("matched").siblings("li").addClass("notmatched");

HTML

HTML

<ul>
<li>
<label>Test</label>
</li>
<li>Oh Nu</li>
</ul>

CSS

CSS

.matched {
background: yellow
}

.notmatched {
background: aqua;
}

#5

-3

All the Above specified is very exclusive, but try out this too, if its not working let me know.

所有上面指定的都是非常独特的，但是尝试这个，如果它不工作让我知道。

VAR $YesitHas=$("lable").innerText("SuperSweetCheckBox");

#1