마스터가 로컬 저장소 및 세션 저장소를 자세히 설명합니다.

이 기사에서 제공하는 내용은 로컬 저장소 및 세션 저장소에 관한 것입니다. 도움이 필요한 친구들이 참고할 수 있기를 바랍니다. [고급 튜토리얼: Html5 tutorial]

sessionStorage 속성을 사용하면 세션 Storage 개체에 액세스할 수 있습니다. localStorage에 저장된 데이터에는 만료 시간 설정이 없다는 점을 제외하면 localStorage와 유사하지만 sessionStorage에 저장된 데이터는 페이지 세션이 끝나면 지워집니다. 페이지 세션은 브라우저가 열려 있는 동안 유지되며, 페이지를 다시 로드하거나 복원하면 원래 페이지 세션이 유지됩니다. 새 탭이나 창에서 페이지를 열면 새 세션이 초기화되는데, 이는 세션 쿠키 작동 방식과 다릅니다.

읽기 전용 localStorage를 사용하면 원격(원본) 개체에 액세스할 수 있습니다. 문서 데이터의 저장소는 브라우저 간 세션으로 저장됩니다. localStorage는 sessionStorage와 유사합니다. 차이점은 localStorage에 저장된 데이터는 무한하며 페이지 세션이 끝나면, 즉 페이지가 닫히면 sessionStorage에 저장된 데이터가 지워진다는 것입니다.

간단히 말해서 localStorage는 브라우저 영구 저장 솔루션이며 SessionStorage는 한 페이지에만 존재한다는 점에서 SessionStorage는 새 페이지가 열릴 때 재설정됩니다. 데이터가 localStorage 또는 sessionStorage에 저장되는지 여부는 페이지의 프로토콜에 따라 다릅니다

기본 사용법

먼저 작업을 살펴보겠습니다. of sessionStorage

#🎜🎜 #1. sessionStorage에 데이터를 저장합니다. sessionStorage.setItem('key', 'value');

2에서 데이터를 가져옵니다.

var sessionData = sessionStorage.getItem('key');

#🎜 🎜#3. sessionStorage 데이터에서 저장된 데이터를 삭제합니다

sessionStorage.removeItem('key');

4. 모두 제거

sessionStorage.clear();

동일한 localStorage에도 비슷한 작업이 있습니다

1.저장 data

localStorage.setItem(`key`, `value`);

# 🎜🎜#2. 데이터 가져오기

let cat = localStorage.getItem(`key`);

3. 단일 데이터

localStorage.removeItem(`key`);

4를 모두 삭제합니다. localStorage.length를 통해 수행할 수 있습니다. localStorage에 있는 키-값 쌍의 수를 가져옵니다. 마찬가지로 localStorage.key() 메서드를 사용하여 localStorage에 저장된 키-값을 순회할 수도 있습니다.

storage 이벤트

저장된 데이터가 변경되면 저장 이벤트가 발생합니다. 하지만 저장 이벤트는 알림에 가깝고 취소할 수 없는 클릭 이벤트와는 다르다는 점에 유의해야 합니다. 이 이벤트를 트리거하면 동일한 도메인에 있는 다른 창의 저장 이벤트가 호출되지만 저장을 트리거하는 창(즉, 현재 창)은 이 이벤트를 트리거하지 않습니다. 저장소 이벤트 객체의 공통 속성은 다음과 같습니다(현재 창은 트리거되지 않고 다른 창은 트리거됩니다).

changeEvent의 일반적으로 사용되는 속성은 다음과 같습니다.

localStorage.clear();

위 내용은 마스터가 로컬 저장소 및 세션 저장소를 자세히 설명합니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!