JavaScript에서 이벤트 객체(event)는 이벤트가 발생할 때 관련 정보를 기록하는 데 사용되는 객체입니다. 이벤트 객체는 이벤트가 발생할 때만 생성되며 모든 이벤트에서 이벤트 처리 기능 내에서만 액세스할 수 있습니다. 함수 처리 실행 후 이벤트 객체는 소멸됩니다.
이 튜토리얼의 운영 환경: Windows 7 시스템, JavaScript 버전 1.8.5, Dell G3 컴퓨터.
이벤트 객체는 어떤 이벤트가 발생할 때 관련 정보를 기록하는 데 사용되는 객체입니다.
이벤트 객체는 이벤트가 발생할 때만 생성되며, 이벤트 처리 기능 내에서만 접근할 수 있습니다. 모든 이벤트 처리 기능이 실행되면 이벤트 객체가 소멸됩니다!
참고: 실제로 이벤트는 항상 존재해 왔으며(바운드 또는 모니터링 여부에 관계없이) 이벤트 핸들러가 없습니다! ! !
JavaScript 이벤트는 브라우저나 문서 창에서 발생하는 특정 상호 작용 순간이며 JavaScript와 HTML 간의 상호 작용은 이벤트에 의해 트리거됩니다.
이벤트 핸들러:
이벤트 핸들러: 사용자의 페이지 클릭 동작, 마우스 이동 동작, 웹 페이지 로딩 완료 동작 등은 모두 이벤트 이름으로 불릴 수 있습니다.
즉, click, mousemove, load 등은 다음과 같습니다. 이벤트의 모든 이름. 이벤트에 응답하는 함수를 이벤트 핸들러 또는 이벤트 리스너라고 합니다.
JavaScript의 이벤트는 일반적으로 일반 이벤트, 양식 이벤트, 페이지 이벤트의 세 가지 범주로 나뉩니다.
UI 이벤트: 로드, 언로드, 오류, 크기 조정, 스크롤, 선택, DOMActive 등은 사용자가 페이지의 요소와 상호 작용할 때 트리거됩니다.
Focus 이벤트: Blur, DOMFocusIn, DOMFocusOut, focus, focusin, focusout은 요소가 포커스를 얻거나 잃을 때 트리거됩니다. 이러한 이벤트 중에서 가장 중요한 이벤트는 흐림과 초점이 필요한 것입니다. 주의하세요. 이 클래스 이벤트는 버블링되지 않습니다!
click, dblclick, mousedown, mouseenter, mouseleave, mousemove, mouseout, mouseover, mouseup과 같은 마우스 및 휠 이벤트는 사용자가 마우스를 통해 페이지에서 작업을 수행할 때 트리거됩니다.
스크롤 휠 이벤트: 마우스휠(IE6+에서 지원), DOMMouseScroll(FF에서 지원, 마우스휠과 동일한 효과). 마우스 휠을 사용할 때 트리거됩니다.
텍스트 이벤트: textInput, 문서에 텍스트가 입력되면 트리거됩니다.
키보드 이벤트: keydown, keyup, keypress는 사용자가 키보드를 통해 페이지에서 작업을 수행할 때 트리거됩니다.
Synthetic 이벤트: DOM3 레벨에 새로 추가되었으며 IME의 입력 시퀀스를 처리하는 데 사용됩니다. 소위 IME는 사용자가 실제 키보드에서 찾을 수 없는 문자를 입력할 수 있는 입력 방식 편집기를 말합니다. 구성시작, 구성업데이트, 구성종료라는 세 가지 이벤트가 있습니다.
변경 이벤트: DOMsubtreeModified, DOMNodeInserted, DOMNodeRemoved, DOMAttrModified, DOMCharacterDataModified 등은 기본 DOM 구조가 변경될 때 트리거됩니다. IE8 - 지원되지 않습니다.
이름 변경 이벤트: 요소 또는 속성 이름이 변경되면 트리거됩니다. 현재는 더 이상 사용되지 않습니다.
기본적인 이벤트 종류에는 HTML5의 등장과 발전에 따라 HTML5 이벤트, 디바이스 이벤트(싱글 터치), 터치 이벤트, 터치 이벤트, 제스처 이벤트 등 다양한 이벤트가 추가되었습니다.
리소스 이벤트
이벤트 이름 | 트리거될 때 |
---|---|
error | 리소스 로딩이 실패할 때. |
abort | 리소스 로딩이 중단된 경우. |
load | 리소스 및 관련 리소스가 로드되었습니다. |
beforeunload | 창, 문서 및 해당 리소스가 곧 언로드됩니다. |
unload | 문서 또는 종속 리소스를 언로드하는 중입니다. |
네트워크 이벤트
이벤트 이름 | 실행되는 시기 |
---|---|
online | 브라우저가 네트워크에 액세스할 수 있게 되었습니다. |
오프라인 | 브라우저에서 네트워크 액세스가 끊어졌습니다. |
WebSocket 이벤트
이벤트 이름 | 트리거될 때 |
---|---|
open | WebSocket 연결이 설정되었습니다. |
message | WebSocket을 통해 메시지를 받았습니다. |
error | WebSocket 연결이 비정상적으로 종료되었습니다(예: 일부 데이터를 보낼 수 없음). |
close | WebSocket 연결이 종료되었습니다. |
CSS 애니메이션 이벤트
이벤트 이름 | 트리거 시점 |
---|---|
animationstart | 특정 CSS 애니메이션이 시작될 때 트리거됩니다. |
animationend | CSS 애니메이션이 완료되면 트리거됩니다. |
animationiteration | CSS 애니메이션이 완료 후 다시 시작될 때 트리거됩니다. |
CSS 전환 이벤트
이벤트 이름 | 실행 시기 |
---|---|
transitionstart | 듣기 전환 이벤트가 시작될 때 트리거됩니다. |
transitionrun | 전환 이벤트를 수신할 때 트리거됩니다. |
transitionend | 듣기 전환 이벤트가 끝나면 트리거됩니다. |
인쇄 이벤트
이벤트 이름 | 실행 시기 |
---|---|
beforeprint | 프린터가 준비되면 실행됩니다. |
afterprint | 프린터가 꺼지면 트리거됩니다. |
클립보드 이벤트
이벤트 이름 | 발생 시기 |
---|---|
cut | 선택한 텍스트 내용을 잘라내어 클립보드에 복사했습니다. |
copy | 선택한 텍스트 내용이 클립보드에 복사되었습니다. |
paste | 클립보드에서 복사한 텍스트 내용이 붙여넣어집니다. |
【관련 추천: 자바스크립트 학습 튜토리얼】
위 내용은 자바스크립트 이벤트 객체란 무엇인가요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!