페이지 새로 고침 후 JavaScript 변수를 어떻게 유지할 수 있습니까?

페이지 새로 고침 이후에도 JavaScript 변수 보존

JavaScript에서는 버튼 클릭이나 기타 이벤트를 통해 변수를 동적으로 수정할 수 있습니다. 그러나 기본적으로 페이지를 새로 고치면 이러한 변경 사항이 손실됩니다. 페이지를 새로 고친 후에도 변수가 값을 유지하도록 어떻게 보장할 수 있나요?

로컬 및 세션 저장소

JavaScript의 영구 저장소는 window.localStorage라는 두 가지 방법을 통해 달성됩니다. 및 window.sessionStorage. 둘 다 키-값 쌍을 저장하는 수단을 제공하지만 미묘한 차이가 있습니다.

• localStorage: 데이터는 브라우저 세션과 재시작 후에도 무기한 지속됩니다.
• sessionStorage: 데이터는 현재 브라우저 세션 동안에만 유지되며 창이나 탭이 실행되면 지워집니다. 닫힙니다.

데이터 저장:

영구 저장소에 변수를 저장하려면 원하는 키와 값과 함께 setItem()을 사용하세요.

var someVarName = "value";
localStorage.setItem("someVarKey", someVarName);

데이터 검색 중:

이후 페이지 새로 고침, getItem()을 사용하여 저장된 데이터 검색:

var someVarName = localStorage.getItem("someVarKey");

이렇게 하면 페이지가 새로 고쳐진 후에도 저장된 값이 someVarName에 할당됩니다.

제한 사항 극복 :

로컬 및 세션 저장소는 문자열 값만 지원합니다. 더 복잡한 데이터 유형을 저장하려면 JSON 사용을 고려하세요.

var obj = {
  prop1: "value1",
  prop2: "value2"
};

localStorage.setItem("objKey", JSON.stringify(obj));

나중에 데이터 검색 및 구문 분석:

var obj = JSON.parse(localStorage.getItem("objKey"));

추가 리소스:

• 브라우저 저장 공간: https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Storage
• 로컬 저장소: https://developer.mozilla.org/en-US/docs/DOM /스토리지#로컬스토리지

위 내용은 페이지 새로 고침 후 JavaScript 변수를 어떻게 유지할 수 있습니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!