Проверьте задачу (LI) в списке TODO с JS ⇐ Html

[Anonymous]

Я начинаю изучать код, и после нескольких раз, проведенных на HTML / CSS, я начинаю изучать JS. Я начал создавать список TODO, управлять (с некоторой помощью и некоторое время), чтобы иметь возможность создавать задачи и добавлять их в список. Я также могу удалить их. Я хотел бы изменить текстовое разрешение и цвет фона задачи, когда я нажимаю на кнопку «Проверка» (это будет в стороне кнопку «Удалить»). < /P>
Я искал уже несколько часов, и я не могу найти. Я настоящий новичок в JS, я не знаю много вещей, только основы. Кто -нибудь может мне помочь? < /P>
html: < /p>







To-Do List




To-Do List!


Ajouter

< /code>
js: < /p>

//SELECTORS
let taskInput = document.querySelector('#myInput');
let addTaskButton = document.querySelector('#button');
let taskList = document.querySelector('#list');
//EVENT LISTENERS

addTaskButton.addEventListener('click',addTask);

//FUNCTIONS

function addTask() {

//PREVENT THE FORM FROM SUBMITING
event.preventDefault();

if(taskInput.value === "") {
alert("Please enter a task!")
}
else {
//CREATE TASK DIV
let taskDiv = document.createElement('div');
taskDiv.classList.add('task');

//CREATE LI
let taskLi = document.createElement('li');
taskLi.innerText = taskInput.value;
taskLi.classList.add('task-li');
taskDiv.appendChild(taskLi);

//DELETE BUTTON
let deleteButton = document.createElement('button');
deleteButton.innerHTML = '';
deleteButton.classList.add('delete-btn');
taskDiv.appendChild(deleteButton);

taskList.appendChild(taskDiv);

//CLEAR INPUT VALUE
taskInput.value = '';

deleteButton.addEventListener('click', () => {
taskDiv.remove()
});

//CHECK BUTTON
let checkButton = document.createElement('button');
checkButton.innerHTML = '';
checkButton.classList.add('check-btn');
taskDiv.appendChild(checkButton);

}
}
< /code>
Вот захват моего списка Todo.

Подробнее здесь: https://stackoverflow.com/questions/733 ... st-with-js