Local, Websql, off-line application storage in HTML5

Source: Internet
Author: User
Tags browser cache web database

1. HTML5 Storage-related APIs

A) Localstorage local Storage

b) Web SQL database storage on local databases

c) . manifest Offline Application Storage

2. HTML5 localstorage Local storage:

A) local storage is a window property:equivalent to a large Cookie;

b) Window.localstorage:

c) Set method:

I. localstorage.t1 = "AAA";

II. LOCALSTORAGE[T2] = "BBB";

III. localstorage.setitem ("T3", "CCC");

D) Get method:

I. localstorage.t1;

II. LOCALSTORAGE[T1];

III. Localstorage.getitem ("T1");

E) Delete method:

I. Localstorage.removeitem ();

II. localstorage.clear ();//clear all;

f) Traversal method:

I. localstorage.length;

II. Localstorage.key ();

3. HTML5 Web Sql database:

A) the Web Sql database API is not actually part of the HTML5 specification;

b) existed before the HTML5, and was a separate norm;

c) It is to store data in the form of a database in the client, according to the requirements to read;

D) the difference with storage is that both storage and cookies exist in the form of key-value pairs;

e) The Web SQL is easy to retrieve, allowing SQL statement query;

f) Allow the browser to implement small database storage functions;

g) This database is integrated in the browser, the current mainstream browser has basically been supported;

4. HTML5 Web DataBase operation:

A) OpenDatabase ():

I. window.opendatabase ("Database name ", "Specify Database version 1.0 or 2.0", "Database Description ", database size, bytes );

II. Create database objects, you can use existing databases, or you can create new databases;

III. return an object;

b) transaction ():

I. database.transaction (FN (obj));

II. For triggering operation; The parameter is an anonymous function;

c) ExecuteSQL ():

I. tx.executesql (SQL statement , SQL parameter , return source , error );

II. For executing SQL

5. HTML5 local offline application storage:

A) relationship with HTML5 local storage, local database;

6. Offline Application:

A) Web2.0 technology encourages individual participation, and everyone is a writer of web content, such as Weibo;

b) Web applications can provide offline functionality, allowing users to write content without a network, and then sync to the Web when there is a network ;

c) offline applications in the first load of the time to download all resources, cache to the local, offline applications and browser cache is different, we can specify the content of the cache, you can also specify that those things need to read the database;

d) HTML5 support for offline functions, when the first visit to access the server, and download a storage list, from the list to download the contents, stored in the specified location, when we clear the browser cache, it is not clear to this content, the content is specified stored, Browser two times, even if the network is broken or can access the cache to local content, the user in the network during the operation, through the Web SQL storage, and so on when the network of local data transmitted up;

7. HTML5 enables offline application operations:

A) Configure the server:

I. Let the server support the . manifest type file;

Ii. addtype text/cache-manifest. manifest

b) Create a manifest file: (storage manifest )

I. CACHE MANIFEST//Declaration file Header

II. #This is a comment

III. CACHE//offline storage files

Iv. Network//files that require networking calls

V. FALLBACK//resource expires or unavailable update file

c) Associating manifest files to HTML documents

8. HTML5 offline content update:

A) Automatic Update:

b) Manual update:

I. Detecting the value of window.applicationCache.status; if it is updateready

II. update the cache with window.applicationCache.update;

Local, Websql, off-line application storage in HTML5

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.