WebページのオフラインローカルストレージはLocalstorageとuserdataを使用して実現され、主流ブラウザと互換性があります.
10051 ワード
本文はネット上の先輩たちが書いたことを参考にして、自分でいくつかの方法を追加して修正しました.私はchrome、firefox、ie 8、ie 9とie 10の互換モードのテストの下で正常に運行することができて、ここに置いて必要な人に使いましょう.
ここではまずlocalstorageとuserdataについて簡単に紹介します.
localstorageはhtml 5の特性であり、ローカルストレージをサポートする容量が大きく、userdataはie家である.ie 8からlocalstorageがサポートされていますが、htmlがサーバ側に必要で、ローカルであればieはサポートされていません.以下のコードはオフラインでローカルに格納できるもので、主な考え方はlocalstorageとuserdataを同じ方法インタフェースにカプセル化し、ブラウザタイプを判断し、異なる特性を用いて同じインタフェースを実現することです.このようなメリットは、操作方法がブラウザによって変更されずにもう一度書くことです.実は簡単です.
http://www.cnblogs.com/yuzhongwusan/archive/2011/12/19/2293347.html
ここではまずlocalstorageとuserdataについて簡単に紹介します.
localstorageはhtml 5の特性であり、ローカルストレージをサポートする容量が大きく、userdataはie家である.ie 8からlocalstorageがサポートされていますが、htmlがサーバ側に必要で、ローカルであればieはサポートされていません.以下のコードはオフラインでローカルに格納できるもので、主な考え方はlocalstorageとuserdataを同じ方法インタフェースにカプセル化し、ブラウザタイプを判断し、異なる特性を用いて同じインタフェースを実現することです.このようなメリットは、操作方法がブラウザによって変更されずにもう一度書くことです.実は簡単です.
<html>
<head>
<script type="text/javascript">
var Sys = {};
var ua = navigator.userAgent.toLowerCase();
var s;
(s = ua.match(/msie ([\d.]+)/)) ? Sys.ie = s[1] :
(s = ua.match(/firefox\/([\d.]+)/)) ? Sys.firefox = s[1] :
(s = ua.match(/chrome\/([\d.]+)/)) ? Sys.chrome = s[1] :
//
if (Sys.firefox)
{
var local = {
setItem:function(nam,val)
{
window.localStorage.setItem(nam,val);
},
getItem:function(nam)
{
return window.localStorage.getItem(nam);
},
removeItem:function(nam)
{
window.localStorage.removeItem(nam);
},
clear:function()
{
window.localStorage.clear();
},
length:function()
{
window.localStorage.length();
},
key:function(i)
{
window.localStorage.key(i);
}
}
document.write('Firefox: ' + Sys.firefox);
}
if (Sys.ie)
{
var box = document.body || document.getElementsByTagName("head")[0] || document.documentElement;
UserData_obj = document.createElement('input');
UserData_obj.type = "hidden";
UserData_obj.addBehavior ("#default#userData");
box.appendChild(UserData_obj);
//
var local= {
setItem:function(nam,val)
{
UserData_obj.load(nam);
UserData_obj.setAttribute(nam,val);
var d= new Date();
d.setDate(d.getDate()+700);
UserData_obj.expires=d.toUTCString();
UserData_obj.save(nam);
UserData_obj.load("local_userdata");
var dt=UserData_obj.getAttribute("local_userdata");
if(dt==null)dt='';
var reg=new RegExp(nam);
// nam ，
if(!reg.test(dt)){
dt=dt+nam+",";
}
UserData_obj.setAttribute("local_userdata",dt);
UserData_obj.save("local_userdata");
},
// setItem
getItem:function(nam)
{
UserData_obj.load(nam);
return UserData_obj.getAttribute(nam);
},
// getItem
removeItem:function(nam)
{
UserData_obj.load(nam);
clear_userdata(nam);
UserData_obj.load("local_userdata");
var dt=UserData_obj.getAttribute("local_userdata");
var reg=new RegExp(nam+",","g");
dt=dt.replace(reg,'');
var d= new Date();
d.setDate(d.getDate()+700);
UserData_obj.expires= d.toUTCString();
UserData_obj.setAttribute("local_userdata",dt);
UserData_obj.save("local_userdata");
},
// removeItem
clear:function()
{
UserData_obj.load("local_userdata");
var dts=UserData_obj.getAttribute("local_userdata").split(",");
for (var i in dts)
{
if(dts[i]!='')
{
UserData_obj.load(dts[i]);
UserData_obj.removeAttribute(dts[i]);
clear_userdata(dts[i]);
}
}
UserData_obj.load("local_userdata");
UserData_obj.removeAttribute("local_userdata");
clear_userdata("local_userdata")
},
// clear();
clear2:function()
{
UserData_obj.load("local_userdata");
var dts=UserData_obj.getAttribute("local_userdata").split(",");
for (var i in dts)
{
if(dts[i]!='')
{
UserData_obj.load(dts[i]);
UserData_obj.removeAttribute(dts[i]);
clear_userdata(dts[i]);
}
}
clear_userdata("local_userdata");
},
each:function()
{
UserData_obj.load("local_userdata");
var dts=UserData_obj.getAttribute("local_userdata").split(",");
for(var i in dts){
alert(dts[i]);
}
return dts;
}
}
function clear_userdata(keyname)// keyname
{
var keyname;
var d= new Date();
d.setDate(d.getDate()-1);
UserData_obj.load(keyname);
UserData_obj.expires=d.toUTCString();
UserData_obj.save(keyname);
}
document.write('IE: ' + Sys.ie);
}
if (Sys.chrome){
local = {
setItem:function(nam,val)
{
window.localStorage.setItem(nam,val);
},
getItem:function(nam)
{
return window.localStorage.getItem(nam);
},
removeItem:function(nam)
{
window.localStorage.removeItem(nam);
},
clear:function()
{
window.clear();
},
length:function()
{
window.localStorage.length();
},
key:function(i)
{
window.localStorage.key(i);
}
}
document.write('chrome: ' + Sys.chrome);
}
</script>
</head>
<body>
<script type="text/javascript">
window.local.setItem("name_new1","1liangli")
var name1 = window.local.getItem("name_new1");
document.write(name1);
document.write("</br>");
</script>
</body>
</html>http://www.cnblogs.com/yuzhongwusan/archive/2011/12/19/2293347.html