Урок 16 · JavaScript

Добавляем пункт в список из поля

Массив хранит задачи, а страница только показывает его. Не держи правду только в DOM.

Почему это следующий шаг

Форма уже читает текст. Теперь из этого текста растёт список.

Как сделать

Храни задачи массивом строк или объектов. После каждого изменения заново рисуй список: очисти ul и создай li через createElement и textContent. Пустую строку не добавляй. Кнопка удаления должна знать, какой пункт убрать, например по индексу или id. Не собирай пункт через innerHTML из текста человека.

function render() {
  list.replaceChildren();
  tasks.forEach((task) => {
    const item = document.createElement("li");
    item.textContent = task;
    list.append(item);
  });
}

Что проверить

• Новая задача появляется один раз.
• Пустая строка не становится пунктом.
• После обновления страницы список пока пуст: сохранение будет следующим отдельным шагом.