의견 : LocalStorage (로컬 스토리지)는 시간 제한없이 하루, 1 년, 2 년 또는 더 긴 시간없이 데이터를 오랫동안 저장할 수 있으며, 데이터를 사용할 수 있으며, 브라우저가 닫히기 전에만 데이터를 사용할 수 있으며, 다른 페이지를 만들 때만 사용할 수 있으며 브라우저를 닫은 후에는 데이터가 사라집니다.
HTML5 웹 스토리지의 LocalStorage 및 SessionStorage 메서드를 사용하여 웹 페이지 데이터를 저장하십시오.
페이지는 아래 그림과 같이 참조되며 페이지의 데이터는 로컬로 저장할 수 있습니다. 저장된 데이터를 읽고 페이지에 표시 할 수 있습니다.
LocalStorage (로컬 스토리지)는 시간 제한없이 하루, 1 년, 2 년 또는 더 긴 데이터를 오랫동안 저장할 수 있습니다.
브라우저가 닫히기 전에만 사용할 수있는 SessionStorage는 다른 페이지를 만들 때 사용할 수 있으며 브라우저를 닫은 후 데이터가 사라집니다.
Blogger의 테스트 LocalStorage 호환성 상황은 다음과 같습니다.
Chrome4+는 LocalStorage를 지원하기 시작합니다
Firefox3.5+는 LocalStorage를 지원하기 시작합니다
Firefox1.5+는 GlobalStorage를 지원합니다
IE8+는 LocalStorage를 지원합니다
IE7 호환성 모드는 LocalStorage를 지원합니다
IE5.5+는 userData를 지원합니다
Safari 4+는 LocalStorage를 지원합니다
Opera10.5+는 LocalStorage를 지원합니다
<! doctype html>
<html xmlns = "http://www.w3.org/1999/xhtml">
<헤드>
<meta http-equiv = "content-type"content = "text /html; charset = utf-8" />
<제목> </title>
<스타일 유형 = "텍스트/CSS">
Textarea {
너비 : 300px;
높이 : 300px;
}
.Button {
너비 : 100px;
}
</스타일>
</head>
<body>
<script type = "text/javaScript">
// 웹 페이지 데이터의 로컬 저장을 위해 HTML5 웹 스토리지의 LocalStorage 및 SessionStorage 메소드를 사용합니다.
// 페이지에 데이터를 로컬로 저장하려면 다음 그림을 참조하십시오. 저장된 데이터를 읽고 페이지에 표시 할 수 있습니다.
함수 savesession () {
var t1 = document.getElementById ( "t1");
var t2 = document.getElementById ( "t2");
var mydata = t2.Value;
var Ostorage = Window.sessionStorage;
ostorage.mydata = mydata;
T1.Value + = "SessionStorage Save MyData :" + MyData + "/N";
}
함수 readsession () {
var t1 = document.getElementById ( "t1");
var Ostorage = Window.sessionStorage;
var mydata = "존재하지 않는다";
if (ostorage.mydata) {
mydata = ostorage.mydata;
}
T1.Value + = "SessionStorage는 MyData를 읽습니다 :" + myData + "/n";
}
함수 cleansession () {
var t1 = document.getElementById ( "t1");
var Ostorage = Window.sessionStorage;
var mydata = "존재하지 않는다";
if (ostorage.mydata) {
mydata = ostorage.mydata;
}
ostorage.removeitem ( "mydata");
T1.Value + = "SessionStorageClear MyData :" + MyData + "/N";
}
함수 savestorage () {
var t1 = document.getElementById ( "t1");
var t2 = document.getElementById ( "t2");
var mydata = t2.Value;
var Ostorage = Window.localStorage;
ostorage.mydata = mydata;
T1.Value + = "LocalStorage Save MyData :" + MyData + "/N";
}
함수 readStorage () {
var t1 = document.getElementById ( "t1");
var Ostorage = Window.localStorage;
var mydata = "존재하지 않는다";
if (ostorage.mydata) {
mydata = ostorage.mydata;
}
T1.Value + = "LocalStorage는 MyData를 읽습니다 :" + mydata + "/n";
}
함수 cleanstorage () {
var t1 = document.getElementById ( "t1");
var Ostorage = Window.localStorage;
var mydata = "존재하지 않는다";
if (ostorage.mydata) {
mydata = ostorage.mydata;
}
ostorage.removeitem ( "mydata");
t1. value + = "LocalStorageClear mydata :" + mydata + "/n";
}
</스크립트>
<div>
<TextRea> </textRea>
<라벨> 저장할 데이터 : </label>
<입력 유형 = "텍스트" />
<입력 유형 = "버튼"value = "sessionsave" />
<입력 유형 = "버튼"value = "세션 읽기" />
<입력 유형 = "버튼"value = "세션 클리어" />
<입력 유형 = "버튼"value = "로컬 저장" />
<입력 유형 = "버튼"value = "로컬 읽기" />
<입력 유형 = "버튼"value = "로컬 클리어" />
</div>
</body>
</html>