[学习笔记] 【学习笔记】「充实计划-每日打卡」0627 奖励方式：回复跟帖（只包含内容1奖励 ... [推广有奖]

21楼

loyalzhr 发表于 2019-6-27 08:23:24

昨天阅读1小时，累计125小时

已有 1 人评分	论坛币	收起理由
充实每一天	+ 10	精彩帖子

总评分: 论坛币 + 10 查看全部评分

22楼

liuyu1985110 发表于 2019-6-27 08:29:23

昨天阅读1小时，累计306小时

已有 1 人评分	论坛币	收起理由
充实每一天	+ 10	精彩帖子

总评分: 论坛币 + 10 查看全部评分

23楼

124613670 发表于 2019-6-27 08:39:23

昨日阅读1小时，累计阅读568小时 27

已有 1 人评分	论坛币	收起理由
充实每一天	+ 10	精彩帖子

总评分: 论坛币 + 10 查看全部评分

24楼

HappyAndy_Lo 发表于 2019-6-27 08:41:12

昨日阅读实践4小时，累计551小时
续前一天的示例

      function loadAll(){
         var list = document.getElementById("list");
         if(localStorage.length>0){
               var result = "<ul>";
               for(var i=0; i<localStorage.length; i++){
                  var title = localStorage.key(i);
                  result += "<li>"+title+"</li>";
               }
               result += "</ul>";
               list.innerHTML = result;
         }else{
               list.innerHTML = "still not write Diary? do it now!";
         }
      }
   </script>
</head>
<body>
<div>
   <hgroup style="margin-bottom: 10px">
      <label>Title:</label>
      <input type="text" name="txtTitle" id="txtTitle" />
   </hgroup>
   <hgroup style="margin-bottom: 10px">
      <label>Content:</label>
      <textarea id="txtContent" rows="15" cols="50"></textarea>
   </hgroup>
   <input type="button" value="New Add" />
   <hr />
   <label for="search">Title:</label>
   <input type="text" name="searchTitle" id="searchTitle" />
   <input type="button" value="search" />
   <p id="searchContent" ><br /></p>
</div>
<br />
<div id="list" />

</body>
</html>

使用Web Storage

检测浏览器支持： if(window.sessionStorage) { ....}

保存JSON格式的数据：
var userInfo = {

name: "张三",
age:"24",
email:"sanz@163.com"
};

localStorage.setItem("userInfo", JSON.stringify(userInfo)
读取的时候也有不同：
var newUserInfo = JSON.parse(localStorage.getItem("userInfo"));
var name = newUserInfo.name;
var age=newUserInfo.age;
var email = newUserInfo.email;

清除数据：可以通过浏览器删除，也可以通过removeItem(key)或clear()方法清除
遍历操作：前面示例中，使用localStorage.length属性获取当前浏览器本地数据的所有数目，然后通过for遍历这些数据

Storage事件：当web storage发生变化时触发，可以监视不同页面对storage的修改

几个比较实用的属性：key /oldValue / newValue / url（触发页面改动的URL地址）