input 박스의 onkeydown나 button의 onclick 처럼
이벤트 속성을 직접 지정해 주는것.
todo 리스트에서 특정 버튼을 누르면 할일 목록을 완료했다는 취소선을 추가하는 기능을 만들어보자.
addEventListener('트리거','동작') 형태로 입력하며
버튼을 클릭시 해당 li에 특정 클래스를 달아주도록 하자const newBtn = document.createElement('button') newBtn.addEventListener('click',() => { newLi.classList.toggle('complete') }) newLi.appendChild(newBtn);
버튼도 추가된걸 알 수 있으며
해당 버튼을 눌러보면
class에 complete가 생기는걸 알 수있다.
토글이라서 누를때마다 생겼다 지워졌다함.이제 css에서
.complete { color: rgb(155,155,155); text-decoration: line-through; }와 같은 속성을 넣어주게 되면
버튼을 눌러서 complete class가 붙은 li만 취소선이 생기게 할 수있다.