[추가 중 ] JS - addEventListner 종류 분석 정리

addEventListner

 

 

"click"

사용자가 마우스나 트랙패드 등으로 요소를 클릭할 때 발생합니다. 

해당 요소의 클릭 가능한 영역에서 클릭이 감지될 때 이벤트가 발생합니다. 

const button = document.querySelector(".addBtn");

button.addEventListener( 'click' , function( ){ } )

 

 

 

See the Pen vanila JS change by Emma-Hyejin (@Emma-Hyejin) on CodePen.

 

 

---

 

 

"change"

사용자가 입력 필드의 값을 변경할 때 발생합니다.

예를 들어 체크박스나 라디오 버튼의 선택 여부를 변경할 때 , 혹은 <select> 요소의 선택된 옵션을 변경할 때 이벤트가 발생합니다. 

const input = document.querySelector(".checkbox);

input.addEventListener( 'change' , function( ){ } )

 

 

See the Pen Untitled by Emma-Hyejin (@Emma-Hyejin) on CodePen.