반응형
이벤트
이벤트(event)는 어떤 사건을 의미한다. 브라우저에서의 사건이란 사용자가 클릭을 했을 '때', 스크롤을 했을 '때', 필드의 내용을 바꾸었을 '때'와 같은 것을 의미한다.
<!DOCTYPE html>
<html>
<body>
<input type="button" onclick="alert(window.location)" value="alert(window.href)" />
<input type="button" onclick="window.open('bom.html')" value="window.open('bom.html')" />
</body>
</html>
- 위의 코드는 onclick 속성의 자바스크립트 코드(alert(window.location))는 사용자가 이 버튼을 클릭 했을 '때' 실행된다.
- 즉 js 개발자는 어떤 일이 발생했을 때 실행 되어야 하는 코드를 등록하고, 브라우저는 그 일이 발생했을 때 등록된 코드를 실행하게 된다. 이러한 방식을 이벤트 프로그래밍이라고 한다.
event target
target은 이벤트가 일어날 객체를 의미한다.
target은 버튼 태그에 대한 객체가 된다.
<input type="button" onclick="alert(window.location)" value="alert(window.href)" />
event type
이벤트의 종류를 의미한다. 위의 예제에서는 click이 이벤트 타입이다. 그 외에도 scroll은 사용자가 스크롤을 움직였다는 이벤트이고, mousemove는 마우스가 움직였을 때 발생하는 이벤트이다.
아래 사이트에서 여러 종류의 이벤트를 확인 할 수 있다.
developer.mozilla.org/en-US/docs/Web/Events
Event reference
DOM Events are sent to notify code of interesting things that have taken place. Each event is represented by an object which is based on the Event interface, and may have additional custom fields and/or functions used to get additional information about wh
developer.mozilla.org
event handler
이벤트가 발생했을 때 동작하는 코드를 의미한다. alert(window.location)이 여기에 해당한다.
반응형
'프로그래밍 개발 > JS 웹' 카테고리의 다른 글
| Javascript 이벤트 전파 - 버블링과 캡처링 (0) | 2020.11.23 |
|---|---|
| Javascript 이벤트 - 등록방법 (0) | 2020.11.23 |
| Javascript 문서의 기하학적 특성 (0) | 2020.11.23 |
| Javascript Text 객체 - 조작 API (0) | 2020.11.20 |
| Javascript Text 객체 - 값 API (0) | 2020.11.20 |
댓글