js 브라우저 events_javascript 기술 소개

브라우저 이벤트
브라우저 이벤트는 문서 로드 이벤트 onload, 문서 닫기 이벤트 onunload, 브라우저 포커스 상실 이벤트 onblur, 포커스 얻기 이벤트 onfocus wait 등 문서 로드부터 문서가 닫힐 때까지의 브라우저 이벤트를 의미합니다. .

먼저 다음 코드를 살펴보세요.

코드 복사 코드는 다음과 같습니다.

//소스 프로그램 3.1
"http://www.w3.org/TR/REC- html140/strict.dtd">





body>

문서 로드:

초점 가져오기:

초점 상실:

스크롤 막대 드래그: < /p>

크기 변경:

위의 소스 프로그램을 *.html(또는 *.htm) 문서로 저장합니다. 문서를 두 번 클릭하면 시스템에서 탐색을 위한 기본 브라우저를 호출합니다.


문서가 로드되면 window.load 이벤트가 발생하고 그림 3.2와 같이 경고 상자가 나타납니다.

그림 3.2 문서 로딩 시 window.load 이벤트 발생
포커스가 문서 페이지, 윈도우에 가해지면. onfocus 이벤트가 발생하면 그림 3.3과 같이 경고 상자가 나타납니다.

그림 3.3 문서가 포커스를 얻을 때 window.onfocus 이벤트가 트리거됩니다.
페이지가 포커스를 잃으면 window.blur 이벤트가 발생합니다. 트리거되고 경고 팝업이 나타납니다. 프레임은 그림 3.4에 나와 있습니다.

그림 3.4 문서가 포커스를 잃을 때 window.onblur 이벤트가 트리거됩니다.
사용자가 스크롤 막대를 드래그하면 window.onscroll 이벤트가 트리거되고 팝업됩니다. 경고 상자는 그림 3.5에 표시됩니다.

그림 3.5 스크롤 막대를 드래그하여 window.onscroll 이벤트 실행
사용자가 문서 페이지 크기를 변경하면 window.onresize 이벤트가 발생하면 그림 3.6과 같이 경고 상자가 나타납니다.

그림 3.6 문서 페이지 크기 변경 및 window.onresize 이벤트 트리거
브라우저 이벤트는 일반적으로 창 위치 지정, 타이머 설정을 처리하는 데 사용됩니다. 또는 사용자 기본 설정에 따라 페이지 계층 구조 및 콘텐츠를 설정하는 등의 상황에서 페이지의 상호 작용 및 동적 기능에 널리 사용됩니다.
참고: Netscape Navigator 4는 사용자가 현재 브라우저 창을 이동할 때 발생하는 window.onmove 이벤트를 지원합니다. 이는 주로 창 위치 지정에 사용됩니다. Internet Explorer는 window.onmove 이벤트를 지원하지 않습니다.