javascript - 在 jQuery 中，如何删除只有一个空格的元素？

Question

给定页面上的以下 HTML:

<div class='test'>
<p><span id='id1' class='test1 test2 test3'>test text 1</span></p>
<p><span id='id2' class='test1 test2'>test text 2</span></p>
<span class='test2'> </span>
<p><span id='id3' class='test1'>test text 3</span></p>
<p><span id='id4' class='test1 test3 test2'>text4</span></p>
</div>

如何完全删除第 4 行 <span class='test2'> </span>使用 jQuery？

如果有帮助，我可以通过正则表达式找到它:

var re = new RegExp("<span[^>]*test2[^>]*> </span[^>]*?>");

而且我能够使用 jQuery 查找和删除具有该类的任何节点:

$("span[class*='test2']").remove();

但这会删除所有具有类“test2”的节点，这不是我想要的；我只想删除其中只有一个空格的那个。 $("span[class*='test2']:empty").remove();不起作用，因为该节点不为空，并且有一个空格。

我觉得我很接近，但我错过了一些东西；我希望结果是:

<div class='test'>
<p><span id='id1' class='test1 test2 test3'>test text 1</span></p>
<p><span id='id2' class='test1 test2'>test text 2</span></p>
<p><span id='id3' class='test1'>test text 3</span></p>
<p><span id='id4' class='test1 test3 test2'>text4</span></p>
</div>

有什么线索吗？

Answer 1

       $('span').each(function(){
               var str = $(this).text().replace(/ /g,'');
               if (str.length < 1){
                   $(this).remove();
               }
          });