Question

我有一个页面，其中一些div包含内容，而另一些只有BR标记，我正在尝试删除div只有BR标记的div，以下是html格式

有些像这样

<div>
  <br>
</div>

有些人喜欢这个

<div>
  <br>
  Text goes here text goes here..Text goes here text goes here.. Text goes here text goes here..
</div>

据我所知，我可以找到空白div并轻松删除它，但很难检查内部BR标记并删除，有人可以帮忙！

我试着像这样检查空白div

if(
    $('div').is(':empty')) { 
        $(this).remove();
}

Answer 1

由于:empty具有div元素，

br选择器无效。

您可以使用.filter()获取所有div元素，该元素没有text()，然后才能使用remove()。

$('div').filter(function() {
  return $(this).text().trim().length == 0;
}).remove();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
  <br>Text goes here text goes here..Text goes here text goes here.. Text goes here text goes here..
</div>
<div>
  <br>
</div>

Answer 2

使用jQuery.filter并测试textContent的{{1}}！

element

$('div').filter(function() {
  return this.textContent.trim() === '';
}).remove();

Answer 3

使用$("div").text().trim()

示例代码段：

＆＃13;

if ($("div").text().trim() === "") {
  $("div").html("hellk")
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
  <br>
</div>

＆＃13;

Answer 4

Pure-JS解决方案：找到所有BR元素，这些元素是其父DIV的唯一子元素，然后迭代生成的集合并删除每个BR元素的父元素父级不包含非空白文本：

var brElements = document.querySelectorAll('DIV > BR:first-child:last-child');

Array.from(brElements).forEach(function(br) {
    var div = br.parentNode;

    if (0 === div.textContent.trim().length) {
        div.parentNode.removeChild(div);
    }
});

// For older browsers not supporting `Array.from(arrayLike)`,
// use `Array.prototype.slice.call(arrayLike, 0)`.

这也可能比过滤文档中的所有DIV元素更快。

Answer 5

$('div').each(function(){
    if($(this).text.trim().length == 0) {
        $(this).remove();
    }
})

删除div，如果它有BR而没有文本jQuery

5 个答案: