تعليق: يمكن لـ LocalStorage (التخزين المحلي) تخزين البيانات لفترة طويلة ، دون حد زمني ، يوم واحد ، سنة واحدة ، عامين أو أطول ، يمكن استخدام البيانات ، SessionStorage (تخزين الجلسة) ، فقط قبل إغلاق المتصفح ، يمكن استخدامه عند إنشاء صفحة أخرى ، وستختفي البيانات بعد إغلاق المتصفح.
استخدم أساليب LocalStorage و SessionStorage لتخزين الويب HTML5 لتخزين بيانات صفحة الويب LocalStorage.
تتم الإشارة إلى الصفحة كما هو موضح في الشكل أدناه ، ويمكن تخزين البيانات الواردة في الصفحة محليًا. ويمكن قراءة البيانات المخزنة وعرضها على الصفحة.
يمكن لـ LocalStorage (التخزين المحلي) ، تخزين البيانات لفترة طويلة ، دون حد زمني ، يوم واحد ، سنة واحدة ، عامين أو حتى أطول ، يمكن استخدام البيانات.
يمكن استخدام SessionStorage ، الذي لا يمكن استخدامه إلا قبل إغلاق المتصفح ، عند إنشاء صفحة أخرى ، وستختفي البيانات بعد إغلاق المتصفح.
إن وضع توافق 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">
<head>
<meta http-equiv = "content-type" content = "text /html ؛ charset = utf-8" />
<title> </title>
<type type = "text/css">
textarea {
العرض: 300 بكسل ؛
الارتفاع: 300 بكسل ؛
}
.زر {
العرض: 100px ؛
}
</style>
</head>
<body>
<script type = "text/javaScript">
// استخدم أساليب LocalStorage و SessionStorage لتخزين الويب HTML5 للتخزين المحلي لبيانات صفحة الويب.
// راجع الشكل التالي لتخزين البيانات الموجودة على الصفحة محليًا. ويمكن قراءة البيانات المخزنة وعرضها على الصفحة.
الوظيفة 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" ؛
}
</script>
<viv>
<evideArea> </textarea>
<label> البيانات المراد حفظها: </label>
<نوع الإدخال = "النص" />
<type type = "button" value = "sessionsave" />
<type type = "button" value = "Session Read" />
<type type = "button" value = "session clear" />
<type type = "button" value = "Local Save" />
<type type = "button" value = "local read" />
<type type = "button" value = "localclear" />
</div>
</body>
</html>