Question

如何仅使用JavaScript删除h1空标记？

<h1>Hello Plunker!</h1>
<p>adadasdasdasdsaddasd</p>


<h1></h1>
<p>adadasdasdasdsaddasd</p>

<h1></h1>
<p>adadasdasdasdsaddasd</p>

<h1></h1>
<p>adadasdasdasdsaddasd</p>

Answer 1

你可以

var els = document.querySelectorAll('h1'), //find all h1
    el;
for (var i = 0; i < els.length; i++) {
    el = els[i];
    //if there is no first child 
    if (!el.firstChild) {
        //remove the node
        el.parentNode.removeChild(el)
    }
}

演示：Fiddle

Answer 2

如果你使用jquery试试这个：

  $('h1').each(function(){
       if($(this).is(':empty')){
         $(this).remove()
       }
    });

有关详细信息，请参阅http://api.jquery.com/is/和http://api.jquery.com/empty-selector/

Answer 3

还可以使用css空标记来尝试：

http://codepen.io/anon/pen/aOOmOj

h1:empty { background: #ccc; display:none; }

Answer 4

使用javascript的最简单的解决方案：

while (!document.getElementsByTagName('h1')[0].remove()) {}

是的，我知道，只要不再有h1，循环就会以

结尾

TypeError: ... is undefined`.

但是，嘿，简单。

使用javascript删除HTML h1空标记

4 个答案: