получение нулевого значения кнопки

#javascript #html

#javascript #HTML

Вопрос:

Я создаю приложение todo. Я создаю кнопку добавления, которая работает отлично. Но кнопка корзины продолжает возвращать нулевое значение. Я не могу найти решение в Google, я не нашел решения. Кто-нибудь может мне здесь помочь

 var todoList = document.getElementById("todolist");
var addBtn = document.getElementById("add-btn");
var taskName = document.getElementById("task-name");
var trashBtn = document.getElementById("trash");

addBtn.addEventListener("click", addFunction);

function addFunction() {
  var task = document.createElement("div");
  task.classList.add("task");
  var tname = document.createElement("li");
  tname.setAttribute("id", "li-task");
  var trash = document.createElement("BUTTON");
  trash.setAttribute("id", "trash");
  trash.innerHTML = '<i class="fas fa-trash"></i>';
  tname.appendChild(trash);
  task.appendChild(tname);
  todoList.appendChild(task);
}

console.log(trashBtn);
console.log(addBtn); 
 <div class="main">
  <header>
    <h1>Doer's List</h1>
  </header>
  <div class="add-task">
    <form>
      <input type="text" id="task-name">
      <button id="add-btn" type="button"><i class="fas fa-plus-circle"></i></button>
    </form>
  </div>
  <div class="to-do-list">
    <ul id="todolist"></ul>
  </div>
</div> 

Помощь здесь

Ответ №1:

Вам нужно получить кнопку корзины по идентификатору ПОСЛЕ того, как вы добавили ее на страницу.

Ответ №2:

Я вместо того, чтобы создавать новую переменную trashBtn, я использовал переменную, которая определяется при создании Elemnt.