使用javascript从DOM树中删除p元素

时间:2011-05-19 09:22:04

标签: javascript dom css-selectors getelementsbyclassname

这应该很简单,但我需要帮助才能解决问题: 我需要从DOM树中删除带有“goup”类的元素 使用javascript(最终使用原型,但没有其他库)。 我不仅要隐藏该段落,还要将其从DOM树中完全删除。

我使用getElementsByClassName的解决方案不起作用。

function hidegoup() {
    var goup= document.getElementsByTagName("p")
        .getElementsByClassName("goup"); 
     goup.style.display = 'none';   
     goup.removeChild();
}

HTML:

<div id="poems">
    <div class="poem" id="d1">
        <p class="goup">
        <a href="#">To the top of the page</a>
        </p>
    </div>
</div>

2 个答案:

答案 0 :(得分:5)

如果要从DOM中删除node,请使用:

node.parentNode.removeChild(node);

关于你想做什么:

function hidegoup() {
    var p_list = document.getElementsByTagName("p");
    for(var i=p_list.length-1; i>=0; i--){
        var p = p_list[i];
        if(p.className === "goup"){
            p.parentNode.removeChild(p);
        }
    }
}

答案 1 :(得分:1)

  1. getElementsByClassName返回NodeList,而不是Node。您必须使用for循环
  2. 进行迭代 不支持
  3. getElementsByClassName,但在最近的浏览器中,您应该使用a library that abstracts the differences away
  4. removeChild删除调用它的元素的指定子元素:parent.removeChild(child);,不要在要删除的元素上调用它。