最近在做一个网站，由于希望尽可能减小服务器的压力，也想提高网站的运转速度，就想尽可能少的在服务器上读写数据以及下载重复数据，需要重复使用的数据，就储存在本地，能在本地进行的运算，尽一切可能在本地完成。
于是就出现一个本地存储数据的问题。如果ie不是国内最广泛的浏览器，如果ie9（ie8存在一些问题，后面再说）已经得到普及，那么一切就都很简单了，用html5的localstorage，一切都变得异常简单——谷歌浏览器早就支持localstorage了，但ie支持得很晚。
问题是，ie8以下的浏览器不支持localstorage；据说ie8支持localstorage，但我把ie升级到ie8之后，任然无法使用localstorage——一开始我以为是我的程序有问题，后来又觉得是ie8安装有问题，重装之后，我最终确定是ie8的升级程序有问题，微软的东西总是这么烂，早已习以为常了——这一来一去，差不多折腾了我三四个小时。
于是乎我确定，即便用户浏览器是ie8，也要考虑无法使用localstorage的可能——而且从前段时间别人使用我的网站的情况来看，这种可能性还很大。
既然ie8要排除在外，而ie9只能在win7上使用，win7现在又远未达到全面普及的程度——那么就必须解决低版本ie使用localstorage的兼容问题——真是生不逢时，再过几年就根本不用考虑这个兼容问题了。
网上有几篇讨论这个问题的文章（都是中文，我读英文网页还是有一定心理障碍），其中被转载最多的是这篇：http://www.cnblogs.com/zjcn/archive/2012/07/03/2575026.html
由于我还属于刚入门的菜鸟级程序员，所以很多东西根本弄不懂，坑爹的是这篇文章给的代码零零散散，没法直接把它的代码直接嵌到程序里，而要弄懂它代码的意思又需要大费周章，另外找到几篇文章，把代码放进去，又会冒出一大堆我搞不懂的错误。
于是我决定从最基础的原理开始，自己动手来做兼容程序，别人没有为你定做贴身的程序，就只有靠自己了，好在原理很简单：
ie浏览器在很早的时候就支持一种UserData的本地存储功能，不过ie的UserData用起来比localstorage麻烦得不止一点半点（当然二者的差异还不止于此），接下来要做的就是用UserData来模拟localstorage的所有功能。
localstorage有几项核心功能：
1window.localStorage.getItem( key );——读变量
2window.localStorage.setItem( key, value );——写变量
3window.localStorage.removeItem( key );——删除变量
4window.localStorage.clear(); ——变量初始化
5window.localStorage.length;——本地变量的个数；
6window.localStorage.key( i );——按序号读取变量；
对于我做网站来说，最后两个功能基本用不上，我就没写，但要实现也很简单,如果你需要的话可以联系我，我们一起切磋。
接下来就是要用UserData前面几项模拟功能，关于UserData的使用方法，我主要是参考了这篇文章：
http://www.jb51.net/article/24086.htm
不过这篇文章也有几个坑爹的地方，让我浪费了不少时间。
等我把UserData和localStorage的基本用法都弄懂了之后，我发现上面那篇介绍兼容方法的文章有不少亮点，但也有很多不如人意的地方——最大的问题是他是采用了用节点储存变量的方法，这样的话变量的总大小不能超过124k，这个规模对我的网站来说太小了，于是我采用了用文件储存的方式，这样变量大小就能达到1M,够用了。
敲了几个小时的键盘，反复调试后，这段代码终于可以用了。(代码在下面)
使用方法：
（1）把这段代码放在第一个进行本地存储的语句之前的任何位置；
（2）代码必须在<html>标签内；
（3）不能将本地变量名设为"userdata_record"
（4）不能以 userdataobj 命名变量
（5）加入代码后，如果不使用localStorage.length和localStorage.key( i )，那么你就完全按照localStorage的使用方法进行本地存储就可以了。
如果有问题欢迎和我联系。
<script language="JavaScript" type="text/javascript">
if(typeof(localStorage)=='undefined')
{var box = document.body || document.getElementsByTagName("head")[0] || document.documentElement;
userdataobj = document.createElement('input');
userdataobj.type = "hidden";
userdataobj.addBehavior ("#default#userData");
box.appendChild(userdataobj);
//设定对象
var localStorage= {
setItem:function(nam,val)
{userdataobj.load(nam);
userdataobj.setAttribute(nam,val);
var d= new Date();
d.setDate( d.getDate()+700);
userdataobj.expires=d.toUTCString();
userdataobj.save(nam);
userdataobj.load("userdata_record");
var dt=userdataobj.getAttribute("userdata_record");
if(dt==null)dt='';
dt=dt+nam+",";
userdataobj.setAttribute("userdata_record",dt);
userdataobj.save("userdata_record");},
//模拟 setItem
getItem:function(nam)
{userdataobj.load(nam);
return userdataobj.getAttribute(nam); },
//模拟 getItem
removeItem:function(nam)
{userdataobj.load(nam);
clear_userdata(nam)
userdataobj.load("userdata_record");
var dt=userdataobj.getAttribute("userdata_record");
var reg=new RegExp(nam+",","g");
dt=dt.replace(reg,'');
var d= new Date();
d.setDate( d.getDate()+700);
userdataobj.expires= d.toUTCString();
userdataobj.setAttribute("userdata_record",dt);
userdataobj.save("userdata_record");
},
//模拟 removeItem
clear:function(){
userdataobj.load("userdata_record");
var dt=userdataobj.getAttribute("userdata_record").split(",");
for (var i in dt)
{if(dt[i]!='')clear_userdata(dt[i]) }
clear_userdata("userdata_record")
}
//模拟 clear();
}
function clear_userdata(keyname)//将名字为keyname的变量消除
{var keyname;
var d= new Date();
d.setDate( d.getDate()-1);
userdataobj.load(keyname);
userdataobj.expires=d.toUTCString();
userdataobj.save(keyname);
}
}
</script>
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
