1、本地存储 1.2本地存储类型 本地数据库 本地数据库是HTM提供的浏览器端数据库,可以在客户端存储大量 结构化数据并直接通过 JavaScript API高效检索,主要有 Web SQL与 IndexedDB两种类型。 WebS哑L是一种运行于浏览器的关系数据库。可以通过SL语句执行数据的插入或检 索等操作。 ■ IndexedDB是一种索引数据库,是一个不断发展中的网络标准,这个标准用于在浏览 器中存储大量结构化的数据,并提供索引以保证高效率的查询
1、本地存储 1.2本地存储类型 本地数据库 本地数据库是HTML提供的浏览器端数据库,可以在客户端存储大量 结构化数据并直接通过JavaScript API高效检索,主要有Web SQL与 IndexedDB两种类型。 Web SQL是一种运行于浏览器的关系数据库。可以通过SQL语句执行数据的插入或检 索等操作。 IndexedDB是一种索引数据库,是一个不断发展中的网络标准,这个标准用于在浏览 器中存储大量结构化的数据,并提供索引以保证高效率的查询
1、本地存储 1.2本地存储类型 Cookie Cookie是HM4中已经存在的本地存储机制,多用于网站辨识用户身 份、进行 session跟踪而储存在用户本地终端上,以key- value形式 进行存储数据,浏览器存储 Cookie大小\有限
1、本地存储 1.2本地存储类型 Cookie Cookie是HTML4中已经存在的本地存储机制,多用于网站辨识用户身 份、进行session跟踪而储存在用户本地终端上,以key-value形式 进行存储数据,浏览器存储Cookie大小有限
2、 Web Storage 2.1 session Storage 数据存储的实现 sessionStorage是 Storage对象的一个实例,浏览器中会话级别的 WebStorage,对应 Windows对象 sessionStorage属性。 W3C组织为 sessionStorage制定的接囗定义如下所示。 [ Nolnterfaceobject interface WindowSession Storage readonly attribute Storage sessionStorage Window implements Window Session Storage
2、Web Storage 2.1 sessionStorage 数据存储的实现 sessionStorage是Storage对象的一个实例,浏览器中会话级别的WebStorage,对应 Windows对象sessionStorage属性。 W3C组织为sessionStorage制定的接口定义如下所示
2、 Web Storage 2.1 session Storage 数据存储的实现 案例21-01: sessionStorage示例演示程序 <script type tert/ javascript> 存储筒单数据 function saveSimpleString0 I var xsl=document. getElementById(zs") sessionStorage, setItem(" course’,"eb前端技术开发与实践 xs1 value=se torage getItem( course) document. write (xsl value) 存储结构化教据 function saveStructuredData0 I var studentInfo =[ arsenUm " coursenum":"1","nme":“姓名”], " courseNum":"2,"nme":“性别”], essionStorage. setItem("studentInfo, JSON. stringify(studentInfo))
2、Web Storage 2.1 sessionStorage 数据存储的实现 案例21-01:sessionStorage示例演示程序 <script type="text/javascript"> //存储简单数据 function saveSimpleString() { var xs1=document.getElementById("xs"); sessionStorage.setItem("course", "Web前端技术开发与实践"); xs1.value=sessionStorage.getItem("course"); document.write(xs1.value); } //存储结构化数据 function saveStructuredData() { var studentInfo = [ { "courseNum": "0", "name": "学号" }, { "courseNum": "1", "name": "姓名" }, { "courseNum": "2", "name": "性别" }, ] sessionStorage.setItem("studentInfo", JSON.stringify(studentInfo)); } </script>
2、 Web Storage 2.1 session Storage 创建数据项 sessionStorage和 localStorage都将数据存储为项,项采用键/值组合的格式,每个 值在存储前都要转化为字符串, sessionStorage继承 Storage对象。 sessionStorage创建数据项使用 setItem(方法,具体如下所示。 创建数据项,存储简单字符串。 ∥存储简单数据 session Storage. setltem" course","web前端技木开发与实践
2、Web Storage 2.1 sessionStorage 创建数据项 sessionStorage和localStorage都将数据存储为项,项采用键/值组合的格式,每个 值在存储前都要转化为字符串,sessionStorage继承Storage对象。 sessionStorage创建数据项使用setItem()方法,具体如下所示。 创建数据项,存储简单字符串