zoukankan      html  css  js  c++  java
  • Document对象的一些小总结

    cookie 是document对象的一个方方法,每次请求url时都会传递到服务器现代浏览器允许cookie总数超过300个,但是部分浏览器对单个cookie大小限制仍然有4Kb的限制
    先来cookie 存储都有哪些选项
       name   要存储的cookie名字
       value  要存储的cookie的值  不允许包含分号,逗号和空白符 因此存储钱一般都可以采用encodeURIComponent()对值进行编码,读取的时候 用decodeURIComponent()进行解码
       max_age  单位为秒  要超时的秒数  
       path      如果把路径设置成:"/"  那么cookie 可以对任何 http://www.example.com这台服务器上的页面都是可见的 (该状况下和localstorage具有同样的作用域)
                 如果把路径设置成:"/catalog"  那么cookie 可以对任何 http://www.example.com/catalog/ 下面的页面都是可见的 (不能通过path来做访问控制-588)
       domain    默认为当前服务器的域
                 子域之间的cookie共享可通过设置".example.com",path设置成:"/" 
                 那么该cookie 就对所有catalog.example.com、orders.example.com以及其他.example.com 域下的任何服务器都可见
       secure   bool类型的值   表明cookie 以何种方式通过网络传递 默认是以不安全的形式传递的
      
      存储形式:
          document.cookie='name='+encodeURIComponent(value)+';max_age=1200;path=/domain=;secure=;'  其中name和value 是必须的
      读取:
          function getCookie(){
           var cookie={};
           var all=document.cookie;
           if(all==="") return cookie;
           var list=all.split(";");
           for(var i=0;i<list.length;i++){
           var cook=list[i];
           var p=cook.indexOf("=");
           var name=cook.substring(0,p);
           var value=cook.substring(p+1);
           value=decodeURIComponent(value);
           cookie[name]=value;
           }
           return cookie;
          }
      删除:  只需要一个name 即可
           document.cookie=name=;max_age=0
          

    localStorage 和sessionStorage
       这个两个属性都代表同一个Storeage对象: 一个持久化关联的数组 数组使用字符串来索引 存储的值也是字符串形式的
       两者的主要区别为:
            localStorage 用于长期保存网站的数据并且站内任何页面都可访问该数据
            sessionStorage 用于临时保存针对一个窗口或者标签页的数据 书上介绍的是: 在访客关闭窗口活标签页之前,这些数据都是存在的,而关闭之后就会被浏览器删除;不过只要用户不关闭窗口或者标签页,就算他从你的网站跑到别人的网站再回来,数据依然是存在的
            (可跨越页面刷新而存在) 存储在sessionStorage中的数据 只能由最初给对象存储数据的页面能访问到,所以多页面访问有限制
      存储:
         localStorage.setItem(name,value)   标准的存
         localStorage[name]=value
         localStorage.name=value
      读取:
         value=localStorage.getItem(name)   标准的读
         value=localStorage[name]
         value==localStorage.name
       可枚举
          for(var i=0;i<localStorage.length;i++){
          var name=localStorage.key(i);
          var value=localStorage.getItem(name);
          }
          for( var key in localStorage){
          var name=key;
          var value=localStorage.getItem(name);
          }
      删除:
         删除一项  localStorage.removeItem(name);
         删除全部  localStorage.clear();
      事件:(IE8及以前版本不支持该事件)
         window.addEventListener("storage",function(e){
            console.log(e.key+"---"+ e.newValue+"---"+ e.oldValue+"----"+ e.url+"----"+ e.url+"---"+ e.domain+"----"+ e.storageArea)
        },false)
        触发条件:当存储数据真正发生改变的时候(含删除)
        对象属性(e):
            key 被设置或者移除的项的名字 (clear 触发的时候 key=null)
            newValue  保存该项的新值 (调用removeItem()时 该属性为null)
            oldValue  改变或者删除该项前 保存该项原先的值 (当插入一个新项时该值为null)
            url   触发该文档变化所在的url
      需要注意的是 其保存的都是字符串 取值运用的时候 需要注意转换格式
             localStorage 和存储事件都是采用的广播机制,浏览器会向目前正在访问同样站点的所有窗口发送消息(不会向本窗口发送,IE会向本窗口发送)

  • 相关阅读:
    javaMap
    javaCollections
    java线程
    mysql插入,删除
    mysql基础(1)
    javaSet,Date
    中青杯数学建模大赛
    javaJDBC
    中秋记事~~项目开发
    太高兴了,今天有人送我吃月饼!
  • 原文地址:https://www.cnblogs.com/ArthurXml/p/5427547.html
Copyright © 2011-2022 走看看