HTML5 LocalStorage를 사용하여 구현된 기능
LocalStorage는 도메인(사이트)별로 브라우저에서 임의의 영역에 데이터를 저장하는 기능으로, 브라우저 설정에 따라 저장할 수 있는 데이터 양이 결정 됨
IE 하위 버전도 지원 함 (세부 내용 및 스펙은 http://www.w3.org/TR/webstorage/#storage 참조)
쿠키와 비슷하지만 만료일이 없고, 브라우저에 따라 저장 가능한 용량이 5MB ~ 10MB 사이 임 (멀티 브라우징을 위해 5MB 이하로 저장하는 것을 권장)
Type
- engine
Property Summary
Event Summary
Method Summary
- clear( )
- 동일한 도메인으로 LocalStorage에 저장 된 모든 데이터를 삭제함
- getAllItem( )
- 동일한 도메인으로 LocalStorage에 저장 된 모든 데이터를 키, 값 형태의 객체로 반환
- getItem( keyName )
- 동일한 도메인의 LocalStorage에서 지정된 keyName에 할당되어 있는 값을 반환
- key( index )
- 동일한 도메인의 LocalStorage에서 인덱스에 해당하는 키를 반환
- removeItem( key )
- 동일한 도메인의 LocalStorage에서 키와 일치하는 데이터를 삭제
- setItem( keyName , value )
- 동일한 도메인의 LocalStorage에 키, 값으로 이루어진 데이터(Item)를 저장
Property Detail
Event Detail
Method Detail
- clear( )
-
동일한 도메인으로 LocalStorage에 저장 된 모든 데이터를 삭제함
이 함수는 'Page Scope'가 적용되지 않음Sample// localStorage에 저장 된 모든 데이터를 삭제 $p.local.clear(); - getAllItem( )
-
동일한 도메인으로 LocalStorage에 저장 된 모든 데이터를 키, 값 형태의 객체로 반환
이 함수는 'Page Scope'가 적용되지 않음Return type description JSON 키, 값이 저장 된 JSON 객체 Samplevar tmpData = $p.local.getAllItem(); //반환 값 예시 ) { name:"WebSquare" , version:"5.0" } - getItem( keyName )
-
동일한 도메인의 LocalStorage에서 지정된 keyName에 할당되어 있는 값을 반환
이 함수는 'Page Scope'가 적용되지 않음Parameter name type required description keyName String Y LocalStorage에 저장된 키 Return type description String LocalStorage에서 keyName에 할당된 값을 반환 (할당된 값이 없을경우 null을 반환) Sample// 예시 1) 할당된 값이 있는 경우 - $p.local.setItem("exam_1", "WebSquare"); 또는 localStorage.setItem("exam_1","WebSquare"); var strResult1 = $p.local.getItem("exam_1"); // 반환 값 예시) "WebSquare" // 예시 2) 할당된 값이 없는 경우 var strResult2 = $p.local.getItem("exam_2"); // 반환 값 예시) null - key( index )
-
동일한 도메인의 LocalStorage에서 인덱스에 해당하는 키를 반환
LocalStorage에 저장된 키의 인덱스 값은 브라우저마다 다를 수 있음 (예를 들어 크롬은 마지막에 저장한 값이 0번째에 위치하지만 IE는 첫 번째에 저장한 값이 0번째에 위치함)
$p.local.length() 함수와 함께 사용하여 전체 키 목록을 확인할 수 있음
이 함수는 'Page Scope'가 적용되지 않음Parameter name type required description index Number Y LocalStorage에 저장된 키의 인덱스 Return type description String index에 해당하는 키 값을 반환 (해당하는 키 값이 없을 경우 null을 반환) Sample// 아래의 스크립트를 통해 1개의 값이 LocalStorage에 저장되어 있는 경우 $p.local.setItem("exam_1", "WebSquare"); // 예시 1) var strResult = $p.local.key(0); // 반환 값 예시) 'exam_1' - removeItem( key )
-
동일한 도메인의 LocalStorage에서 키와 일치하는 데이터를 삭제
모든 데이터를 삭제하려면 $p.local.clear() 함수를 사용해야 함
이 기능은 'Page Scope'가 적용되지 않음Parameter name type required description key String Y LocalStorage에 할당된 데이터(Item)의 키 Sample// 아래의 스크립트를 통해 1개의 값이 localStorage에 저장되어 있는 경우 $p.local.setItem("exam_1", "WebSquare"); // 예시 1) Local 'exam_1'로 저장된 데이터를 삭제 $p.local.removeItem("exam_1"); - setItem( keyName , value )
-
동일한 도메인의 LocalStorage에 키, 값으로 이루어진 데이터(Item)를 저장
이 기능은 'Page Scope'가 적용되지 않음Parameter name type required description keyName String Y LocalStorage에 저장할 키 value String Y LocalStorage에 저장할 값 Sample// 예시) LocalStorage에 키 "exam_1"로 값 "WebSquare"를 할당 $p.local.setItem("exam_1", "WebSquare"); // 위의 스크립트로 등록된 데이터는 아래의 스크립트로 반환받을 수 있음 $p.local.getItem("exam_1");