我希望能够检查一个元素中是否包含任何文本。如果其中没有任何文本，我希望能够删除该元素。
但是，这个 dom 元素可能包含一个或多个子元素，并且这些子元素也可能包含其他子元素。所以我希望能够遵循元素的 dom 树，并在其中的所有元素中搜索文本。
类似这样的：
<div id="myElement">
<span></span>
<span></span>
<span>
<span></span>
<span>b</span>
</span>
</div>
现在 div 直接没有任何文本，但是它的孩子有。如何检查整个div中是否有任何文字？
编辑：
显然我在其中一个跨度中有一个&#8203; 字符，我知道这是一个零宽度的空白。所以基本上即使没有文本，jQuery text() 也会找到它并返回 false。
我该如何解决？
【问题讨论】：
标签： javascript jquery html css dom
jQuery 的text() 方法包含后代，所以：
$('.my-element-class').each(function() {
if ( $(this).text() === '' ) {
$(this).remove();
}
});
要单独检查所有后代元素，我们必须稍微复杂一点：
$('.my-element-class').find('span').andSelf().each(function() {
...
【讨论】：
只需使用 jQuery 函数 text() 来检查是否有任何文本在里面（它会忽略任何方式里面的 html 标签，所以不用担心里面的孩子。） 如果要删除空格，可以使用 trim。
var text = $('#myElement').text();
var trimedText = text.trim();
去除零宽度空白：
var text = trimmedText.replace(/[\u200B\uFEFF]/gm,'');
【讨论】：
遍历 myElement 的所有后代并检查它们的 html()。如果值不为空 "" 则递归迭代该对象。
$( "#myElement" ).find( "*" ).each( function(){
var $element = $(this);
if ( $.trim( $element.html() ).length == 0 )
{
$element.remove();
}
});
【讨论】：
这个函数递归地检查和删除空元素（嵌套与否），它还处理空白问题。
function removeEmptyElements(elem) {
var childNodes = elem.childNodes;
var allEmpty = true;
for (var index in childNodes) {
if (childNodes[index]) {
if (childNodes[index].nodeType === 3 && !/^\s*$/.test(childNodes[index].textContent)) {
allEmpty = false;
}
else if (childNodes[index].nodeType === 1) {
if (!childNodes[index].hasChildNodes()) {
//here childNodes[index] is the empty element
childNodes[index].parentNode.removeChild(childNodes[index]);
} else {
//do a recursive call to check whether any of the nested elements are empty
removeEmptyElements(childNodes[index]);
}
allEmpty = false;
}
}
}
if (allEmpty) {
//here elem is the empty element
elem.parentNode.removeChild(elem);
}
}
将“根”元素（在您的示例中为 myElement）传递给函数 removeEmptyElements。
简单来说就是这样的：
获取根元素的所有子节点。
默认假设所有子节点都是空白/空白。
遍历每个子节点。
如果这些子节点之一不是非空白文本，请将 allEmpty 设置为 false，因为现在知道根元素不为空
否则，如果子节点是有效元素：
检查是否有子节点，如果没有则删除
如果它有子节点，则使用该元素进行递归调用
由于现在知道根元素包含有效元素，它不再被认为是空的，因此将 allEmpty 设置为 false。
如果 allEmpty 未设置为 false，则根元素为空，因此您可以将其删除。
【讨论】：
这些答案都没有使用innerText，这可能是最简单的。
innerText 获取当前节点和所有后代的渲染文本。
所以要检查你的节点的子树中是否有任何文本，你可以使用这一行：
myNode.innerText.trim() === '';
如果此表达式的计算结果为 true，则 myNode 或其子项中没有文本。
【讨论】：