[JavaScript] 이벤트 핸들러 - 이벤트 생성, 이벤트 제거

이번 글은 이벤트 생성과 제거에 대한 글이다.

 

---

 

[ 이벤트 생성과 제거 ]

• addEventListener : 이벤트 생성하기
• removeEventListener : 이벤트 삭제하기

 

만약 아래 코드와 같이 작성된 상황이라면 해당 printBtn 이벤트는 삭제되지 않는다.

=> addEventListener로 등록 후 동일한 레퍼런스로 removeEventListener를 호출해야 정상작동

const btn = document.querySelector('#btn');

function printBtn() {
  console.log(btn.outerHTML);
}

btn.onclick = printBtn;
btn.removeEventListener('click', printBtn);

 

 

위에 코드에서 printBtn을 아래 코드처럼 호출해줬다면 정상작동됨

btn.addEventListener('click', printBtn);

 

 

---