pageshow 와 pagehide이벤트를 위한 이벤트 객체
브라우저는 문서를 처음 로드할 때 load 이벤트 다음에 pageshow 이벤트를 발생 시키며,
문서를 벗어날 때는 pagehide 이벤트를 발생시킨다.
pageshow와 pagehide 이벤트는 window 객체에서 발생하며,
PageTransitionEvent 객체는 두 이벤트와 조합된다.
pageshow와 pagehide는 버블링되지 않고, 취소 가능한 기본 동작도 존재하지 않는다.
(크롬에서 pageshow, pagehide는 디버깅이 안타지던데 이 때문인가..)
해당 이벤트 객체의 persisted 프로퍼티의 값은 페이지가 로드 또는 새로고침이 아니라 복원되었을 경우에 true이다.
페이지가 네트워크 또는 디스크 캐시로부터 로드 또는 새로고침 될 때는 false의 값을 가진다.
persisted 프로퍼티는 pagehide에선 항상 true이고, pageshow에서만 true/false의 값을 가진다.
load
- 문서와 해당 문서의 외부 리소스들이 모두 로드되었을 때
pagehide
- 페이지가 캐시되어 있으며 다른 페이지에 의해 교체되었을 때
pageshow
- 페이지가 처음 로드되면 load이벤트 직후에 pageshow이벤트가 발생한다. 해당 이벤트에는 persisted 값이 false이지만, 페이지가 브라우저의 메모리 캐시로부터 복구되었다면 load이벤트가 발생하지 않으며(캐시된 페이지가 이미 loaded상태이기 때문), persisted 프로퍼티 값이 true로 설정된 이벤트객체와 함께 pageshow 이벤트가 발생한다.
unload
- 브라우저가 페이지로부터 다른 곳으로 벗어날 때. 페이지의 onunload 핸들러를 등록하면, 페이지가 캐시되지 않는다는 사실에 주의하자. 사용자가 새로고침엇ㅂ이 빠르게 현재 페이지로 되돌아오게 하려면, onpagehide를 대신 사용하는 편이 낫다.
출처 : 자바스크립트 완벽 가이드 / 데이비드 플레너건
'Javascript' 카테고리의 다른 글
| nodeJs 입력받기 (Javascript 입력처리) (0) | 2023.04.15 |
|---|---|
| MDN- re-introduction JavaScript (0) | 2020.09.27 |
| JavaScript 개발자가 알아야할 33개 컨셉 10. setTimeout, setInterval and requestAnimationFrame (0) | 2020.02.01 |
| iframe을 이용한 유튜브 동영상 삽입방법 (0) | 2020.01.20 |
| JavaScript 개발자가 알아야할 33개 컨셉 09. Message Queue and Event Loop (0) | 2019.12.31 |