JavaScript의 change 이벤트

이번 강의에서는 입력 필드의 값이 변경될 때 발생하는 change 이벤트를 함께 살펴보겠습니다. 이게 무슨 뜻일까요? 예를 들어, 당신에게 인풋 필드가 있고 그 안에 어떤 텍스트가 있다고 가정해 봅시다. 만약 그 텍스트를 변경한다면, 바로 이때 이 이벤트가 발생합니다.

예제를 통해 알아보겠습니다. 다음과 같은 인풋 필드가 있다고 해봅시다:

html<input id="elem" value="text">

값이 변경될 때마다 그 새로운 값을 콘솔에 출력해 봅시다:

javascriptlet elem = document.querySelector('#elem');

elem.addEventListener('change', function() {
  console.log(this.value);
});