本地存储、懒加载

webStorage 包含 localStorage和sessionStorage

localStorage : 长期存储/本地存储, 在浏览器中存储的数据会长期存在,除非手动删除, 常用来存储网站的浏览历史,搜索历史,收藏,书签, 某些网站的账号等

sessionStorage:会话存储/短期存储, 浏览器窗口一旦关闭, 则立即删除, 常用来存储一些网页的登录状态

本地存储的增删改查：

        1, 增  注意只支持字符串类型存储

        locStorage.setItem("name","张三")

        localStorage.setItem("sex",false)

        sessionStorage.setItem("age",20)

        var obj = {name:"李四"}

        sessionStorage.setItem("alfriend", JSON.stringify(obj))

        2, 删

        localStorage.removeItem("name")  //通过key删除数据

        sessionStorage.removeItem("age")

        sessionStorage.clear()  // 清空数据

        3, 改 和增使用相同API, 无此key则添加,有此key则修改

        localStorage.setItem("sex", "true")

        localStorage.setItem("phone", "110")

        sessionStorage.setItem("age",30)

        // 4, 查

        console.log(localStorage.length)  // 查看数据长度

        console.log(sessionStorage.length)

        // 通过key值取出某一条数据

        console.log(localStorage.getItem("sex"))

        // 遍历取出所有的数据

        for(var i = 0; i < localStorage.length; i++ ){

            var key = localStorage.key(i)

            console.log(localStorage.getItem(key))

        }

懒加载

懒加载的原理：在一些元素例如<img>中 当<img>未在视图中，页面中的src并不赋入内容，这样就不会一次像浏览器申请大量请求（减少页面需求），放止浏览器崩溃。