(八)webStorage使用实例——利用storage事件实时监视webStorage中的数据

   在HTML5中,可以通过window对象的storage事件进行监听并指定其事件处理函数的方法来定义当其在其他页面中修改sessionStorage或localStorage中的值时所要执行的处理,代码如下:

 

window.addEventListener('storage',function(){
            //当sessionStorage或localStorage中的值发生变动时所要执行的处理
        },false);


在事件处理函数中,触发事件的事件对象(event参数值)具有如下属性:

1、event.key属性:属性值为在sessionStorage或localStorage中被修改的数据键值;

2、event.oldValue属性:属性值为在sessionStorage或localStorage中被修改前的值;

3、event.newValue属性:属性值为在sessionStorage或localStorage中被修改后的值;

4、event.url属性:属性值为在sessionStorage或localStorage中值的页面URL地址;

5、event.storageArea属性:属性值为变动的sessionStorage对象或localStorage对象;

 

示例如下:

storage.html




    
    利用storage事件实时监视webStorage中的数据
    


    

 

storage2.html




    
    修改webStorage中的数据
    


    请输入一些值:
    

 

你可能感兴趣的:(Web前端,大话HTML)