Похоже, не удается понять, как правильно удалить дочерние узлы

#javascript #html

#javascript #HTML

Вопрос:

Итак, я создал небольшой дисплей. Если вы нажмете на слово фильтра, оно должно отображать тег. Пока это работает. Это первый фрагмент кода.

Но если я нажму на слово фильтра, я хочу, чтобы оно снова было удалено из документа, и я не могу этого понять. Это будет вторая функция. Я хочу повторить созданные элементы «отображения» и удалить их снова, если они содержат область «нажатое значение». Материал с комментариями не сработал, я либо получаю сообщение об ошибке, что leng не является функцией, либо что он «не может прочитать свойство 0 неопределенного в tagFunction».

Спасибо за вашу помощь!

 var area = event.target.textContent;                             
var spa = document.createElement("span");
var p = document.createElement("p");
spa.setAttribute('class', 'display');
p.setAttribute("class", "display1")
var text = document.createTextNode(area);                                      
spa.appendChild(p);
p.appendChild(text);
p.addEventListener("click", tagFunction);
document.getElementById("tags123").appendChild(spa);  
 <div class="tags123" id="tags123">

</div>  

 function tagFunction() {

    var area = event.target.textContent; 
             
    var leng = document.getElementsByClassName("display1");
    var tags123 =document.getElementsByClassName("tags123");
 
    for(var ll = 0;ll<leng.length;ll  ){
        if(leng[ll].innerText.trim().contains(area)){
            //tags123.removeChild(leng(ll));
            tags123.children[ll].remove();
            // leng(ll).remove();
        }
    }
}  

Комментарии:

1. Можете ли вы объединить код во фрагменте кода и исправить синтаксическую ошибку, чтобы мы могли его запустить? Спасибо.

2. Это код для виджета, который вы перетаскиваете на сайт. Я не смогу воспроизвести это здесь полностью. Но я думаю, что кода достаточно. Чего вы не понимаете?

3. @Bitlord неучтенная ошибка типа: не удается прочитать свойство ‘target’ в первом фрагменте!

4. Я нашел ошибку, спасибо.

Ответ №1:

Это была ошибка. Сначала мне пришлось объявить parentNode элемента leng[ll].

              if(leng[ll].innerText.trim().contains(bereich)){
                 var vader = leng[ll].parentNode;
                 document.getElementById("tags123").removeChild(vader);
  

Ответ №2:

В двух строках две ошибки:

if(leng[ll].innerText.trim().includes(area)){ //should be contains and not includes

leng(ll).remove(); // should be [ ] and not ( )

это будет так:

if(leng[ll].innerText.trim().contains(area)){

leng[ll].remove();

 var area = "text test";                             
            var spa = document.createElement("span");
            var p = document.createElement("p");
            spa.setAttribute('class', 'display');
            p.setAttribute("class", "display1")
            var text = document.createTextNode(area);                                      
            spa.appendChild(p);
            p.appendChild(text);
            p.addEventListener("click", tagFunction);
            document.getElementById("tags123").appendChild(spa);




function tagFunction() {

            var area = event.target.textContent; 
             
             var leng = document.getElementsByClassName("display1");
             var tags123 =document.getElementsByClassName("tags123");
             console.log(leng);
             for(var ll = 0 ; ll <= leng.length; ll  ){
                 if(leng[ll].innerText.trim().includes(area)){
                    leng[ll].remove();
                 }
             }
  }  
  <div class="tags123" id="tags123">

  </div>