HTML DOM 저장 이벤트는 창의 저장 영역에 변경이 있을 때 트리거됩니다. 저장 이벤트는 다른 창이 창의 저장 영역을 변경하는 경우에만 트리거됩니다. 이 이벤트는 버블링되지 않으며 취소할 수도 있습니다.
구문
다음은 −
의 구문입니다.window.addEventListener("storage", SCRIPT);
예시
Storage Event −
의 예를 살펴보겠습니다.<!DOCTYPE html> <html> <body> <h1>Storage Event Example</h1> <p>Create the visit localStorage item by clicking the below button</p> <button onclick="CreateVisits()">CREATE</button> <p id="Sample"></p> <script> var y=1; window.addEventListener("storage", DisplayChange); function DisplayEvent(event) { document.getElementById("Sample").innerHTML = "The number of visits has been updated"; } function CreateVisits() { y++; var x=window.open("","WINDOW_1","width=350,height=350"); x.localStorage.setItem("VISITS",y); setTimeout(function () { x.close();}, 4000); } </script> </body> </html>
출력
이것은 다음과 같은 출력을 생성합니다 -
CHECK 버튼을 클릭하면 -
개발자 도구의 콘솔 탭에서 localstorage 입력 시 -