Блог

Это должно быть просто, и все же мне нужна помощь в решении проблемы: мне нужно удалить элемент с классом «goup» на нем из дерева DOM с помощью javascript (в конечном итоге с помощью prototype, но без какой-либо другой библиотеки). Я не только хочу скрыть этот абзац, но и полностью удалить его из дерева 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>
  

если вы хотите удалить node из DOM, используйте:

 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. getElementsByClassName возвращает список узлов, а не узел. Вы должны выполнить итерацию по нему с помощью for цикла
2. getElementsByClassName не поддерживается, за исключением последних браузеров, вам, вероятно, следует использовать библиотеку, которая абстрагирует различия
3. removeChild удаляет указанный дочерний элемент элемента, для которого он вызывается: parent.removeChild(child); , вы не вызываете его для элемента, который хотите удалить напрямую.