JavaScript 이벤트 (add, remove)

EventListener 

이벤트 리스너는 DOM 객체에서 이벤트(사용자의 반응)가 발생할 경우 해당 이벤트 처리 핸들러를 추가할 수 있는 오브젝트이다.

---

 

addEventListener

이벤트 리스너를 등록하는 방법입니다.

 

예시는 간단하게 클릭 시, 이모지를 출력하는 예시입니다. 

querySelector로 'button'를 선택하고,  첫 번째 인자에는 이벤트의 종류를 문자로 지정합니다.

두 번째 인자에는 이벤트가 발생했을 때, 핸들러 함수를 전달해야 합니다.

 

 

removeEventListener

이벤트 리스너를 삭제하는 방법입니다.

 

아까 추가한 클릭버튼 옆에 이벤트 삭제 버튼인 remove_btn을 추가하여 

이제 클릭 시, 이모지가 나오는 이벤트를 사용하다 이벤트 삭제 버튼을 누를 시,

이모지가 나오지 않는 즉, 이모지가 나오는 이벤트를 지우는 예시입니다.

 

 

 

이룸코딩 ErumCoding

https://youtu.be/ztDQfvHdZKs?si=58dK-IGi7ikESKkr