DOM을 사용하면 HTML 요소가 이벤트에 응답할 수 있도록 합니다.
예 : 웹 페이지 클릭
: 컴퓨터가 이 이벤트를 감지할 수 있습니다.
이벤트 리스너를 설정하는 두 가지 주요 방법이 있습니다
.
onxxx 속성을 설정하는 것
입니다. () {
// 상자를 클릭하면 여기에 있는 명령문이 실행됩니다.} | 이벤트 이름 | 이벤트 설명 |
|---|---|
| onclick | 객체 위에 마우스가 단일 있을 때 |
| ondblclick | 객체에 마우스를 두 번 클릭할 때 |
| onmousedown | 마우스 버튼을 눌렀을 때 an object |
| onmouseup | 마우스 버튼을 놓았을 때 |
| onmousemove | 마우스 버튼이 object 위에서 움직일 때 |
| onmouseenter | 마우스가 객체에 들어갈 때(onmouseover와 유사한 이벤트) |
| onmouseleave | 마우스가 객체를 떠날 때(비슷한 이벤트 onmouseout) |
| 이름 | 이벤트 설명 |
|---|---|
| onkeypress | 키보드 키를 눌렀을 때(화살표 키, 기능 키와 같은 시스템 버튼을 인식할 수 없음) |
| onkeydown | 키보드 키를 눌렀을 때(시스템 버튼을 인식할 수 있으며 onkeypress보다 먼저 발생함) |
| onkeyup | 키보드 키를 눌렀을 때 is release |
| 이벤트 이름 | 이벤트 설명 | |
|---|---|---|
onchange | 사용자가 양식 필드의 내용을 변경하면 | |
| onfocus | 가 트리거됩니다.요소에 포커스가 있을 때(예: 탭 키 또는 마우스 클릭) | |
| 요소가 포커스를 잃을 때 | onblur가 | |
| 제출될 | 때 | 제출양식이 제출됨 |
| onreset | 양식이 재설정될 때 |
| 이벤트 이름 | 이벤트 설명 |
|---|---|
| onload | 페이지 또는 이미지가 완료될 때 loading |
| onunload | 사용자가 페이지를 종료할 때 |
외부에서 내부로 시작됩니다 (캡처 단계) . 내부에서 외부로 (버블링 단계)
그러나 onxxx(DOM 레벨 0)와 같이 작성하면 버블링 단계만 모니터링할 수 있으므로 addEventListener() 메서드(DOM 레벨 2)를
사용해야 합니다 .
, 기능(){
// 이벤트 처리 함수입니다.}, true) // true는 캡처 단계를 수신하는 것을 의미하고, false는 버블링 단계를 수신하는 것을 의미합니다.