使用jQuery删除只包含 空格的元素

Question

有没有办法去掉这个？

<p> </p>

使用jQuery？

- Dom

---

问题：您是否控制生成的源代码？如果是这样，您是否考虑过不生成空标签？ - Brian Warshaw

Answer 1

尝试：

$('p')
    .filter(function() {
        return $.trim($(this).text()) === '' && $(this).children().length == 0
    })
    .remove()

这段代码的作用是找到所有没有内容的<p>元素，并将其从DOM中删除。

- Roatin Marth

---

好的过滤器。这将删除所有空的<p>标签。 - Lance Rushing

请注意，这将同时删除 <p><img src="..."></p>。 - Greg

虽然这是一个不错的开始，但我已经因为Greg给出的原因而对这个答案进行了负投票。 - lightyrs

@Greg return $.trim($(this).text()) === '' && $(this).children().length == 0 这样写就可以了。 - JiminP

我在下面提供了一个通用的解决方案，比使用$(this).children().length稍微快一些。 - lightyrs

Answer 2

正如Greg在上面提到的那样，测试修剪过的.text()会删除没有文本，但有一个自包含元素如<img>标签的段落。为避免这种情况，请修剪.html()返回值。由于文本被视为DOM中的子元素，因此您将受到保护。

$("p").filter( function() {
    return $.trim($(this).html()) == '';
}).remove()

- Janson

Answer 3

这可能是CMS的更好解决方案。一些富文本编辑器会在空段落中添加 。

    $("p").filter( function() {

        var html = $(this).html();

        if(html == '' || html == ' ')
            return true;

    }).addClass('emptyP');

- orbitory

Answer 4

也许和这个问题的答案一样，尝试在代码后台实现。使用jquery，我会这样做：

$("p:empty").remove();

您可以使用.empty()方法，它将从匹配元素集中删除所有子节点。

- MaLKaV_eS

---

这不会删除<p> </p>，因为它与:empty选择器不匹配。 - Muhd

在这种情况下，您可以使用以下 CSS：p:empty { display: none; } - ifthenelse

Answer 5

$("p").filter( function() {
            return $.trim($(this).html()) == '';
        }).remove()

我使用这个工具来删除空段落，其中不包含IMG、Input、Select等元素。

- spatanx

Answer 6

如果您想要简单地删除所有空的P元素，或者只有一个空格的P元素，那么您可以这样做：

$('p').map( function(){
  var html = $(this).html();
  if( !html.length || html == ' ' || html == String.fromCharCode(255) )
    return this;
}).remove();

这段代码遍历页面上所有的P元素，如果它们符合某些条件（为空或只包含空格），则将其从DOM中删除。

此外，通过将我们的HTML内容分配给一个本地变量，可以帮助脚本运行更快。为了查找非断行空格，我只需将内容与从ASCII字符代码255创建的字符串进行比较（这是一个非断行空格）。

当简单的过滤器或属性比较不足以解决问题时，jQuery的map()函数非常有用。

您可以在这里阅读更多信息.... http://api.jquery.com/map/

- exoboy

Answer 7

这个函数应该处理任何没有子节点（包括未经过包装的文本节点）的元素。

$("p").filter(function() { 
  return !this.childNodes[0]
}).remove();

- lightyrs

---

这不会删除 <p> </p>，不确定这是否是您的意图。 - Muhd

哎呀，它做了所有的事情，但没有回答OP的问题。那绝对不是我的意图。请给我点踩。 - lightyrs

Answer 8

给它一个id（用于获取选择器）。

<p id="myP"></p>


<script>

$("#myP").remove();

</script>

- Lance Rushing