[자바스크립트 js] 이벤트 핸들러 등록과 삭제 / addEventListener / removeEventListener

// 이벤트 핸들러 등록하기
let btn = document.querySelector('#myBtn');

function event1() {
   console.log('뚝딱 안녕!');
}

funciton event2() {
   console.log('뚝딱 코딩중!');
}

 

 

  1
이벤트 핸들러 등록

// element.addEventListener(event. handler)
btn.addEventListener('click', event1);
btn.addEventListener('click', event2);
**** btn.addEventListener('click', event1()); (x) 소괄호 넣으면 안 된다! 헷갈리지 말 것!!

 

 

  2
이벤트 핸들러 삭제

// element.removeEventListener(event, handler)
btn.removeEventListener('click', event2);

removeEventListener 메소드는 파라미터로 전달하는 타입과 이벤트 핸들러가 addEventListener 메소드로 등록할 때와 동일할 때만 이벤트 핸들러를 삭제 할 수 있다.