ajax初次实践，为博客增加点赞功能- 后端django

通过前面的学习，用ajax发送请求实现的点赞功能已经完成了
经过修改优化，配合layer框架，完成了点赞的功能。

效果

点过赞之后

第一次点赞会有来自提莫的肯定。

完整代码

 window.onload = function () {
            var btn =document.getElementById("support_btn");
            var test = window.location.href.split('/')[4];
            url1 = 'support' + test.toString();
            btn.onclick = function () {
                if (!localStorage.getItem(test)){
                   httpxml= $.ajax({
                    url: url1,
                    data: {
                    },
                    success: function (result) {
                        localStorage.setItem(test,true);
                       $("#likes_num").innerText=httpxml.responseText;
                        layer.open({
                            type: 1,
                            title: false,
                            closeBtn: 0,
                            shadeClose: true,
                            skin: 'user_layer',
                            content: '',
                            time:1200,
                    });
                    }
                });
                } else {
                   layer.msg('你已经点过赞了',{time: 1000});
                }
            }
        }

思路

如何记录下点赞的信息是点赞功能的一个难点。而 localStorage很好的解决了这个问题。
我的方法：
当第一次点赞时，记录下文章id，即：id:true 这个键值对

 localStorage.setItem(test,true);

这里的test是我的文章id。
当然最重要的是判断，这个判断写在ajax请求之前。

if (!localStorage.getItem(test)){

localStorage

localStorage 和 sessionStorage 属性允许在浏览器中存储 key/value 对的数据。

localStorage 用于长久保存整个网站的数据，保存的数据没有过期时间，直到手动去删除。

localStorage 属性是只读的。

使用

保存数据语法：

localStorage.setItem("key", "value");

读取数据语法：

var lastname = localStorage.getItem("key");

最后吹一波layui

简单好用又好看。