jQuery - 通过内部文本查找标签
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/5772255/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jQuery - Find Label By The Inner Text
提问by Chuck Callebs
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.
如果有人可以提供一些帮助,我将不胜感激。
回答by Caspar Kleijne
use the selector :contains()
使用选择器:contains()
var element = $("label:contains('SuperSweetCheckbox')");
The matching text can appear directlywithin 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()
可以写成裸词或用引号括起来。要选择的文本必须具有匹配的大小写。
回答by Vicente Plata
Maybe
也许
$('label[value|="SuperSweetCheckbox"]')
according to:
根据:
http://api.jquery.com/attribute-contains-prefix-selector/
http://api.jquery.com/attribute-contains-prefix-selector/
or
或者
$("label:contains('SuperSweet')")
according to
根据
回答by user1063287
This builds on Caspar's answer, but was too big for comments.
这建立在 Caspar 的回答之上,但对于评论来说太大了。
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://stackoverflow.com/a/18399216/1063287.
https://stackoverflow.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://stackoverflow.com/a/18462522/1063287.
https://stackoverflow.com/a/18462522/1063287。
You can also use filter()
, see:
您还可以使用filter()
,请参阅:
https://stackoverflow.com/a/15364327/1063287).
https://stackoverflow.com/a/15364327/1063287)。
Below is an example of the three variants - :contains()
, filter()
and a custom function:
下面是三个变量的一个例子- :contains()
,filter()
和一个自定义功能:
jsFiddle
js小提琴
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;
}
回答by morgar
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/
回答by Annamacharya
All the Above specified is very exclusive, but try out this too, if its not working let me know.
以上指定的所有内容都非常排他性,但也可以尝试一下,如果它不起作用,请告诉我。
VAR $YesitHas=$("lable").innerText("SuperSweetCheckBox");