jQuery，查找元素是否有任何文本
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/2378620/
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 if element has any text
提问by Mircea
I am dealing with some generated spans and I would like to find which one of them does not contain any text.
我正在处理一些生成的跨度，我想找到其中哪一个不包含任何文本。
The markup is:
标记是：
<span id="layer6">
<span class="drag col"> Some text</span>
<span class="drag col"> More text</span>
<span class="drag col"> </span>
<span class="drag col"> I also have text</span>
</span>
I can get get the ones that have "some text" with this code but I can not get the empty ones:
我可以使用此代码获得具有“某些文本”的那些，但我无法获得空的：
if ($('#layer6 > span.col:contains("some text")').length > 0) {
alert ("I have text");
}
How to get the empty ones? I am thinking in using .length to do it but I did not manage.
如何获得空的？我正在考虑使用 .length 来做这件事，但我没有做到。
回答by Alex
$("span.col").each(function(){
if (!$(this).text().trim().length) {
$(this).addClass("foo");
}
});
Obviously instead of adding a class you can do as you like, return the object etc
显然不是添加一个类，你可以随心所欲，返回对象等
UPDATE: Removed strange hidden character after final semicolon that caused js error.
更新：在导致 js 错误的最后一个分号之后删除了奇怪的隐藏字符。
回答by Gumbo
Use filterto filter those elements that don't have textual contents:
使用filter过滤没有文本内容的元素：
$('#layer6 > span.col').filter(function(){
return $(this).text().trim() != "";
}).length
回答by luminancedesign
$('span:empty').css('background-color','red');
回答by user187291
i'm not aware of such a selector, but it's easy to write
我不知道这样的选择器，但它很容易编写
jQuery.expr[':'].empty = function(obj) {
return jQuery(obj).text().replace(/^\s+|\s+$/, "").length == 0;
}
jQuery.expr[':'].empty = function(obj) { return jQuery(obj).text().replace(/^\s+|\s+$/, "").length == 0; }
jQuery.expr[':'].hasNoText = function(obj) {
return jQuery.trim(jQuery(obj).text()).length == 0;
}
and then, for example
然后，例如
$("#layer6 span:hasNoText").text("NEW TEXT")
just for googlers' benefit, here's the extended version. $("node:matches(/regexp/)") selects nodes whose text content matches given regexp.
只是为了谷歌员工的利益，这是扩展版本。$("node:matches(/regexp/)") 选择文本内容与给定正则表达式匹配的节点。
<script>
/// :matches(regexp)
/// regexp is like js regexp except that you should double all slashes
jQuery.expr[':'].matches = function(obj, index, args) {
var m = (args[3] + "").match(/^\/(.+?)\/(\w*)$/);
var re = new RegExp(m[1], m[2]);
return jQuery(obj).text().search(re) >= 0;
}
</script>
demo:
演示：
<script>
$(function() {
$("div").click(function() {
$("div:matches(/foobar/)").text("foobar was here")
$("div:matches(/foo\s+bar/i)").text("some text")
$("div:matches(/^\s+$/)").text("only spaces")
});
});
</script>
html before
<div>foobar</div>
<div>Foo Bar</div>
<div> </div>
html after
<div>foobar was here</div>
<div>some text</div>
<div>only spaces</div>
