[JS] 008. Making a To Do List(3)
function deleteTodos(event){
console.log(event.target.parentNode);
}
function savetodos(){
localStorage.setItem(TODOS_LS,JSON.stringify(loadedtodos));
}
function painttodo(text){
const li=document.createElement("li"); //생성해준다
const delbtn = document.createElement("Button");
delbtn.innerText="❌";
delbtn.addEventListener("click", deleteTodos)
const span = document.createElement("span");
const newid = loadedtodos.length+1;
span.innerText = text
li.appendChild(span);
li.id=newid;
li.appendChild(delbtn);
toDoList.appendChild(li);
const loadedtodoobj={
text : text,
id : newid
};
loadedtodos.push(loadedtodoobj);
savetodos();
}
===>クリーンアップボタンの下にイベントを追加します.deleetetodosという関数を作成し、クリアボタンを押すと、今どのボタンを押しているかのIDを教えてあげる必要があります.
=>
(ボタンを押すと、どのIDのボタンを押すかを示す)
function deleteTodos(event){
const btn = event.target;
const li = btn.parentNode;
toDoList.removeChild(li);
const cleantodos = loadedtodos.filter(function(todod){
return todod.id !==parseInt(li.id);
});
loadedtodos=cleantodos
savetodos();
}
また、関数に合致する子供たちだけがリストに載っています.
Reference
この問題について([JS] 008. Making a To Do List(3)), 我々は、より多くの情報をここで見つけました https://velog.io/@myway00/JS-008.-Making-a-To-Do-List3テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol