HTML의 onstorage 속성을 사용하면 웹 저장소(Web Storage) 영역이 업데이트될 때 원하는 스크립트를 실행할 수 있습니다. 이 속성은 localStorage나 sessionStorage에 변경 사항이 발생하는 순간 이벤트를 감지해야 하는 상황에서 특히 유용합니다.
참고로 onstorage 이벤트는 같은 출처(origin)를 공유하는 다른 문서에서 저장소가 변경되었을 때 발생합니다. 즉, 동일한 페이지 내부에서 값을 변경하는 경우에는 이벤트가 트리거되지 않으므로, 탭 간 데이터 동기화와 같은 기능을 구현할 때 활용하면 좋습니다.
아래 예제 코드를 실행하여 onstorage 속성이 실제로 어떻게 동작하는지 직접 확인해 보세요.
예제
<!doctype html>
<html>
<head><title>HTML onstorage 속성</title>
</head>
<body>
<h2>환영합니다</h2>
<body onstorage = "javascript:alert('즐거운 학습 여정 되세요!');">
데모 텍스트</body>
</body>
</html>