第8讲 本与地存储Web Storage .pptVIP

接上 script type=text/javascript var addEvent = (function() { if (document.addEventListener) { return function(el, type, fn) { if (el.length) { for (var i = 0; i el.length; i++) { addEvent(el[i], type, fn); } } else { el.addEventListener(type, fn, false); } }; } else { return function(el, type, fn) { if (el.length) { for (var i = 0; i el.length; i++) { addEvent(el[i], type, fn); } } else { el.attachEvent(on + type, function() { return fn.call(el, window.event); }); } }; } })(); 接上 var dataInput = document.getElementById(data), output = document.getElementById(fromEvent), save = document.getElementById(save); addEvent(window, storage, function (event) { if (event.key == storage-event-test) { output.innerHTML =key:+event.key+ ---- old:+event.oldValue+ ---- new:+ event.newValue; } }); addEvent(save, click, function () { localStorage.setItem(storage-event-test, dataInput.value); }); /script /body /html 浏览【例5】的界面 提示 必须将文件上传到Web服务器上（或者localhost），才支持storage事件。 不同浏览器对storage事件的支持情况不同。经测试，Internet Explorer 9可以在当前页面中接收到storage事件，而在firefox和chrome中，必须同时打开两个窗口浏览【例5】，在其中一个窗口中单击按钮，在另一个窗口会接收到storage事件。 3 sessionstorage 3.1 判断浏览器是否支持sessionstorage 3.2 使用sessionstorage保存数据 3.3 获取sessionstorage中的数据 3.4 删除sessionstorage中的数据 3.1 判断浏览器是否支持sessionstorage 在JavaScript中可以使用window. sessionStorage属性检测浏览器对sessionstorage的支持情况。 如果window. sessionStorage等于True，则表明当前浏览器支持sessionstorage；否则表明不支持。 第8讲 本地存储Web Storage 传统Web应用程序将大多数据都存储在Web服务器端的数据库中，本地存储的能力很弱。 而频繁地访问数据库服务器获取数据，不但会增加网络流量，而且影响应用程序的效率。 HTML5的本地存储能力得到了很大的提高，不但可以像传统Web应用程序那样将数据存储在文件中，而且还支持本地的轻型数据库。 本章知识点 1 概述 2 localstorage 3 sessionstorage 1 概述 1.1 HTML4的本地数据存储方式 1.2 HTML5本地存储技术概述 1.1 HTML4的本地数据