localStorage储存数据和处理数据

Posted 2020-06-13

//一、在A页面保存数据
var oChannelList = document.getElementById(‘ullisttop‘);
var aChannerListLi = oChannelList.getElementsByTagName(‘li‘);
var oBatchBtn = document.getElementById(‘batchbtn‘);
var aBatchBtnDd = oBatchBtn.getElementsByTagName(‘dd‘);
var oListDdtil = localStorage.zone_name;
var oListArrTitle = oListDdtil.split(‘,‘);
var oListArrLen = oListArrTitle.length;

for(var i=0; i<aChannerListLi.length; i++){
　　var aChannelListDl = aChannerListLi[i].getElementsByTagName(‘dl‘);
　　for(var m=0; m<aChannelListDl.length; m++){
　　　　aChannelListDl[m].index = m;
　　　　aChannelListDl[m].onclick=function(ev){
　　　　var oEvent = ev||event;
　　　　var obj=oEvent.srcElement || oEvent.target;

　　　　//每条素材中的数据
　　　　var ListImg = this.parentNode.parentNode.parentNode.children[1].src;
　　　　var ListId = this.parentNode.parentNode.parentNode.children[2].value;
　　　　var ZoneId = this.children[1].value;
　　　　var ListCont = this.parentNode.parentNode.parentNode.children[3].innerhtml;
　　　　var ListDate = this.parentNode.parentNode.parentNode.children[4].innerHTML;

　　　　var list = ‘storage‘+this.index+Math.random();

　　　　for(var l=0; l<oListArrTitle.length; l++){//遍历频道
　　　　　　//判断点击的是第几个频道
　　　　　　if(oListArrTitle[l]==oListArrTitle[this.index]){

　　　　　　　　//频道里的两种列表
　　　　　　　　if(obj.innerHTML==‘滚动图内容‘){

　　　　　　　　　　if(window.localStorage){
　　　　　　　　　　　　localStorage[list] = ‘{"rotate":{"img":"‘+ListImg+‘","id":"‘+ListId+‘","zoneid":"‘+ZoneId+‘","content":"‘+ListCont+‘","date":"‘+ListDate+‘"}}‘;

　　　　　　　　　　}
　　　　　　　　}else if(obj.innerHTML==‘列表内容‘){

　　　　　　　　　　if(window.localStorage){

　　　　　　　　　　　　localStorage[list] = ‘{"list":{"img":"‘+ListImg+‘","id":"‘+ListId+‘","zoneid":"‘+ZoneId+‘","content":"‘+ListCont+‘","date":"‘+ListDate+‘"}}‘;
　　　　　　　　　　}
　　　　　　　　}

　　　　　　　}

　　　　　　}

　　　　}
　　}

}

//第二部在B页面整理数据格式

//多个频道，每个频道里有两种形式的列表
var zonenum = localStorage.navlength;//频道的数量
//初始化存放多个频道、几种形式的对象；在我的项目中每个频道有两种形式的列表页
var rotateobj = {};
var listobj = {};

//临时存放数据的对象
var tmpobj = {};

for(var i=0; i<zonenum; i++){//创建各个频道对应的数组

　　tmpobj[‘rotate‘+i] = [];
　　tmpobj[‘list‘+i] = [];
　　//各个对象的各种形式的列表数据，都有了自己放数据的位置
}
//遍历整个本地储存的数据
for(var name in localStorage){

　　for(var count=0; count<zonenum; count++){

　　　　if(name.substring(0,8)==‘storage‘+count){//判断当前的name是属于哪个频道

　　　　　　var datastr = localStorage[name];
　　　　　　var json = new Function(‘return ‘+datastr)();

　　　　　　//频道里两种列表形式，也可以有很多列表形式
　　　　　　if(json.rotate){

　　　　　　　　tmpobj[‘rotate‘+count].push(json);

　　　　　　}else if(json.list){

　　　　　　　　tmpobj[‘list‘+count].push(json);

　　　　　　}

　　　　}

　　}
}
//{rotate0:[data0,data1,data2...],rotate1:[data0,data1,data2...],rotate2:[data0,data1,data2...]}
//{list0:[data0,data1,data2...],list1:[data0,data1,data2...],list2:[data0,data1,data2...]}
//得到我想要的数据结构
for(var m=0; m<zonenum; m++){

　　rotateobj[‘rotate‘+m] = tmpobj[‘rotate‘+m];
　　listobj[‘list‘+m] = tmpobj[‘list‘+m];

}
console.log(rotateobj);
console.log(listobj);

//第三部 展示数据
var oChannelIndex = localStorage.channel_index;//频道的index
for(var name in listobj){
　　if(name == ‘list‘+oChannelIndex){
　　//得到该频道对应的形式进行数据处理
　　//...
　　}
}
for(var name in rotateobj){
　　if(name == ‘rotate‘+oChannelIndex){
　　//得到该频道对应的形式进行数据处理
　　//...
　　}
}