Knowledge required for HTML5 mobile development-Local Storage (1)

Knowledge required for HTML5 mobile development-Local Storage (1)

Local cache is a new HTML5 technology, which makes mobile web development possible. We all know that speed is the key to creating a high-performance mobile application. Before HTML5, only cookies can store data, with a size of only 4 kb. This severely limits the storage of Application Files, resulting in a long loading time for mobile applications developed by the web. With local storage, web mobile applications can be closer to the native.

In the browser, local storage is called through window. localStorage. The code used to determine whether the browser supports local storage is as follows:

if(window.localStorage){ alert('This browser supports localStorage');}else{ alert('This browser does NOT supportlocalStorage');}

If we want to store data locally, the simplest method is window. Add an attribute to localStorage and assign values to it. For example, if we want to store a data name whose value is Tom, we can achieve this through the following method:

window.localStorage.name = “Tom”

Note that string variables must be enclosed in quotation marks. When we want to retrieve the data market in the local storage, we can use the getItem method. The entire code process is as follows:

Var storage = window. localStorage; storage. name = "Tom"; // retrieve name Data var name1 = storage. getItem ("name"); alert (name1 );

The result displayed in the Chrome console is a prompt box showing Tom. It can be seen that we have properly stored and read data in this way.

If you want to delete the stored data, you can use the removeItem method. Add the following code to the above Code:

storage.removeItem(“name”);

At this time, when alert is used again, null is displayed because the data has been cleared.