Проблема с добавлением дочерних узлов

результатом открытия файла является итератор, который может быть преобразован в последовательность, которая имеет длину:

with open(filename) as f:
   return len(list(f))

, это более кратким, чем ваш явный цикл, и позволяет избежать enumerate.

1
задан Paddlepop 18 January 2019 в 15:01
поделиться

3 ответа

Слушатель события 'click' должен быть добавлен к каждому элементу с 'X' (newDeleteX). Вам нужно немного изменить метод createListItem:

function createListItem(text) {
    const newListElement = document.createElement("li");
    newListElement.textContent = text;
    newListElement.setAttribute("class", "todo__item")

    const newDeleteX = document.createElement("span");
    newDeleteX.className= "to__delete";
    newDeleteX.textContent = "X";

    // add event listener to element with "X"
    newDeleteX.addEventListener("click", (event) => {
        event.target.parentElement.remove();
    });

    // add element with "X" to newListElement
    newListElement.appendChild(newDeleteX);

    return newListElement;
}
0
ответ дан Vadi 18 January 2019 в 15:01
поделиться

В вашем примере кода слушатель событий ищет события в SPAN,

todoBodyEl.addEventListener("click", (event) => {
    if (event.target.tagName === "SPAN") {
      let li = event.target.parentNode;
      let ul = li.parentNode;
      ul.removeChild(li);
    }
  });

, но при создании нового элемента вы добавляете кнопку.

function createDeleteX(todoItemEls) {
    const newDeleteX = document.createElement("button");
    //...
}

Изменение кнопки на диапазон (и раскомментирование и вызов) устраняет проблему. Смотрите обновленный код: https://codepen.io/anon/pen/vvqjQd?editors=0010

.
0
ответ дан David784 18 January 2019 в 15:01
поделиться

Это работает как талисман:

const getToDeleteEls = function(){ return document.querySelector(".to__delete"); }
let toDeleteEls = getToDeleteEls(), i = 0;
for(; i < toDeleteEls.length; i++){
  toDeleteEls[i].addEventListener("click", deleteParent);
}
function deleteParent(event){
  event.target.parentNode.parentNode.removeChild(event.parentNode);
}

(Примечание: функция getToDeleteEls должна позволять обновлять toDeleteEls всякий раз, когда добавляется новый элемент (поэтому мы можем добавлять слушателей во вновь созданные промежутки) - но с тех пор я понял, что мой выбор добавлять этих слушателей в цикл for (который также должен запускаться после каждого нового добавления) плох, потому что это создаст много избыточных слушателей. Поэтому я рекомендую пересмотреть эту часть - но ядро функциональность "Нажмите X, чтобы удалить" является твердой.)

0
ответ дан Cat 18 January 2019 в 15:01
поделиться
Другие вопросы по тегам:

Похожие вопросы: