이벤트
이벤트가 발생할 때 (ex click) 실행할 함수는 addEventListener() 메소드를 사용한다.
형태 :
문서객체.addEventListener(이벤트 이름, 콜백 함수)
- 콜백 함수를 이벤트 리스너 또는 이벤트 핸들러라고 부른다. 이건 이벤트가 발생할 때 실행하는 함수다.
이벤트를 제거할 때는 removeEventListener() 메소드를 사용한다.
이벤트 모델
이벤트 모델 : 이벤트를 연결(add)하는 방법
표준 이벤트 모델 : addEventListener() 등의 메소드를 사용하는 방법 <- 현재 표준으로 사용하고 있는 방법이다.
고전 이벤트 모델 : (ex)onKeyup 같이 on 뭐뭐로 시작하는 속성에 함수를 할당해서 연결하는 방법
인라인 이벤트 모델 : on 뭐뭐로 시작하는 속성을 HTML요소에 직접 넣어 이벤트를 연결하는 방법
//인라인 이벤트 모델
<script>
const listener = (event) => {}
</script>
<body onKeyup = "listener(event)">
</body>
: 이 코드에서는 listener()라는 함수를 호출하고 있다. 이때 변수 event를 활용할 수 있고 listener()함수의 매개변수로 전달한다.
'JavaScript' 카테고리의 다른 글
| 07 - localStorage 객체 - 예시 (1) | 2022.06.27 |
|---|---|
| 07 -2 키보드 이벤트로 별 이동하기 (0) | 2022.06.27 |
| 06 -3 얕은 복사(참조 복사)와 깊은 복사(... 전개 연산자) (0) | 2021.12.13 |
| 06-2 String 객체의 메소드(trim, split)와 JSON 객체에 대하여 (0) | 2021.10.10 |
| 04 -2 자바스크립트 for in 반복문, for of 반복문, for 반복문 (0) | 2021.03.19 |
