如何使用JavaScript删除标签？

Question

我有点泡菜。 我要实现的目标是，如果div为空，则将其删除，然后再执行随后要做的事情，这很容易。 困难的部分是试图删除空标签。 我正在使用DNN，它喜欢放入空标签，例如p和br。 我希望能够在执行检查之前将其删除。 到目前为止，这是我的代码

$(document).ready(function(){
var element = document.getElementsByTagName("p"); //Need to remove all tags. not just P
element.parentNode.removeChild(element); //Doesn't target which child

if( !$.trim( $('#container2Test').html() ).length ) {
    alert("empty");
    $('#container2Test').remove();
    $('#container3Test').css({'width' : '50%', 'background-color' : '#3F0'});
    $('#container3Test').append("This is some content");
}
else{
    alert("not empty");
}
});

的HTML：

<div id="container1Test" style="width:30%; height:10em; background-color:#000;">
</div>
<div id="container2Test" style="width:50%; height:10em; background-color:#666;">
    <p></p><br /><p></p>
</div>
<div id="container3Test" style="width:20%; height:10em; background-color:#F66;">
</div>
</html

我尝试了很多选项来尝试删除标签，但是我没有这么运气:(请帮助！

Answer 1

就您的container2test块而言，请尝试使用.text()而不是.html() 。 这将忽略插入的空标签，而只关注文本内容。

关于上面的部分，我不太确定您要达到什么目标。 如果您实现了我之前提到的更改，我认为不需要。

Answer 2

我认为这将是您需要的解决方案...检查一下：

var elmsToClear = $('#container1Test, #container2Test, #container3Test');
elmsToClear.each(function(){
    while($(this).find('*:empty').remove().length); // recursivly kill all empty elements
    if(!$(this).find('*').length){ // if no elements left - kill the parent
        alert($(this).attr('id') + ' is empty...');
        $(this).remove();
    }
    else{ // there is something in here...
        alert($(this).attr('id') + ' is NOT empty...');
    }
});

>>> 解决问题的JS小提琴 <<<

问候 ;）

Answer 3

注意， getElementsByTagName是复数形式：

var elements = document.getElementsByTagName("p");
for (var n=0; n < elements.length; n++) {
    var element = elements[n];
    element.parentNode.removeChild(element); // should work now
}

Answer 4

有一个removeChild（）函数。 那么，为什么不能做这样的事情：

$('div').each(function(){
   if(this.innerHTML == ''){
      this.parentNode.removechild(this);
   }
});

（尚未测试）