刪除空 <p> ，但每組只允許一個

Question

我想知道如何刪除空元素， 但每組只允許一個空元素（非空元素旁邊） ？

就像是 ：

示例HTML：

<p>Hello world</p>
<p><br></p>
<p><br></p> <!--This will remove-->
<p><br></p> <!--This will remove-->
<p>Lorem ipsum dolor sit amet</p>
<p><br></p>
<p><br></p> <!--This will remove-->
<p>Eum ne nostro admodum</p>
<p><br></p>

和jQuery用於檢查空元素：

var p_empty = $('p').filter(function(i,v){return $.trim($(v).text()).length===0;});

現在我得到了所有空元素，但任何想法如何刪除下一個空元素？

工作流程： http ： //jsfiddle.net/jmy0uzw1/

PS：我也在尋找良好的JS性能

Answer 1

在你的情況下，因為你沒有使用容器，你將不得不使用兄弟選擇器+並確保前面的p元素本身不是.empty

$('p.empty:not(p:not(.empty) + p.empty)').remove();

 var p_empty = $('p').filter(function(i, v) { return $.trim($(v).text()).length === 0; }); p_empty.addClass('empty'); $('p.empty:not(p:not(.empty) + p.empty)').remove(); 

 p { padding: 3px 10px; background: #eee; color: #999; font-size: 12px; line-height: 12px; } p.empty { border: 1px dashed #fff; background: #edd; } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.min.js"></script> <p>Hello world</p> <p> <br> </p> <p> <br> </p> <p> <br> </p> <p>Lorem ipsum dolor sit amet</p> <p> <br> </p> <p> <br> </p> <p>Eum ne nostro admodum</p> <p> <br> </p> 

Answer 2

 var p_empty = $('p').filter(function(i, v) { return $.trim($(v).text()).length === 0; }); p_empty.addClass('empty'); $('p.empty + p.empty').remove(); 

 p { padding: 3px 10px; background: #eee; color: #999; font-size: 12px; line-height: 12px; } p.empty { border: 1px dashed #fff; background: #edd; } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <p>Hello world</p> <p> <br> </p> <p> <br> </p> <p> <br> </p> <p>Lorem ipsum dolor sit amet</p> <p> <br> </p> <p> <br> </p> <p>Eum ne nostro admodum</p> <p> <br> </p> 

嘗試這個：

$('p.empty + p.empty').remove();

完整代碼

var p_empty = $('p').filter(function(i, v) {
  return $.trim($(v).text()).length === 0;
});

p_empty.addClass('empty');
$('p.empty + p.empty').remove();

Answer 3

只需在濾鏡中添加更多內容即可

var p_empty = $('p').filter(function(i,v){
    return $.trim($(v).text()).length===0 && $.trim($(v).prev().text()).length===0;
});