LocalStorage存储对象

本地存储
重新理解:
LocalStorage 只能存储字符串格式
如果你存储的是对象,你需要用JSON.stringify(包裹)

然后取这个存储的字符串的时候,如果你取只能取到字符串
所以你需要把字符串弄成对象,需要用 JSON.parse()



//读取本地存储的数据
function getData() {
    var data = localStorage.getItem('todolist');
    if (data != null) {
        // 本地存储里面的数据是字符串格式的,但我们需要的是对象格式
        return JSON.parse(data);
    } else {
        return [];
    }
}

//保存本地存储数据
function saveData(data) {
    localStorage.setItem('todolist', JSON.stringify(data));
}

// 3.删除操作 
$('ol,ul').on('click', 'a', function () {
    // 先获取本地存储
    var data = getData();

    // 删除数据
    var index = $(this).attr('id');
    // console.log(index);
    data.splice(index, 1);

    // 保存到本地存储
    saveData(data);
    // 重新渲染页面
    load();
})


function load() {
    var todoCount = 0;//正在进行的个数
    var doneCount = 0;//已经完成的个数
    // 先读取本地存储数据
    var data = getData();
    console.log(data);
    // 遍历之前先清空ol,ul里面的内容
    $('ol,ul').empty();
    // 遍历这个数据 
    $.each(data, function (i, ele) {
        // console.log(ele);
        if (ele.done) {
            $('ul').prepend('<li><input type="checkbox" checked="checked"><p>' + ele.title + '</p><a href="javascript:;" id=' + i + '></a></li>');
            doneCount++;
        } else {
            $('ol').prepend('<li><input type="checkbox"><p>' + ele.title + '</p><a href="javascript:;" id=' + i + '></a></li>');
            todoCount++;
        }
    })
    $('#todocount').text(todoCount);
    $('#donecount').text(doneCount);

}

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

江河地笑

实践是检验真理的唯一标准

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值