Window localStorage 속성
정의와 사용법
localStorage와 sessionStorage 속성은 웹 브라우저에서 키/값 쌍을 저장할 수 있습니다.
localStorage 객체는 만료 일자가 없는 데이터를 저장합니다. 브라우저를 닫으면 데이터가 지워지지 않으며, 다음날, 주 또는 1년 후에 사용할 수 있습니다.
localStorage 속성은 읽기 전용입니다.
안내:자세히 보기 sessionStorage 속성이 속성은 세션 데이터를 저장합니다(브라우저 탭을 닫으면 데이터가 손실됩니다)。
예제
예제 1
name="lastname"와 value="Smith"의 localStorage 이름/값 쌍을 생성하고, "lastname"의 값을 검색하여 id="result" 요소에 삽입합니다:
// 저장 localStorage.setItem("lastname", "Smith"); // 가져오기 document.getElementById("result").innerHTML = localStorage.getItem("lastname");
예제 2
다음 예제는 사용자가 버튼을 클릭한 횟수를 계산합니다:
if (localStorage.clickcount) { localStorage.clickcount = Number(localStorage.clickcount) + 1; } else { localStorage.clickcount = 1; } document.getElementById("result").innerHTML = "You have clicked the button " + localStorage.clickcount + " 번 클릭됨.";
문법
window.localStorage
localStorage에 데이터를 저장하는 문법:
localStorage.setItem("key", "value");
localStorage에서 데이터를 읽는 문법:
var lastname = localStorage.getItem("key");
localStorage에서 데이터를 제거하는 문법:
localStorage.removeItem("key");
기술 세부 사항
반환 값: | Storage 객체 |
---|
브라우저 지원
표에 나타난 숫자는 이 속성을 완전히 지원하는 첫 번째 브라우저 버전을 지정합니다.
속성 | Chrome | IE | Firefox | Safari | Opera |
---|---|---|---|---|---|
localStorage | 4.0 | 8.0 | 3.5 | 4.0 | 11.5 |