Parsing new features in HTML5 local storage localStorage_html5 tutorial tips

Html5’s local storage is data stored locally through the browser.
The basic usage is as follows:

JavaScript CodeCopy content to clipboard

1. > 
2. localStorage.firstName = "Tom";
alert(localStorage.firstName);
 

In this case, the data is saved locally, but in what form is the local data saved? After tracking, it is found that in the Chrome browser, the data is stored in the form of a sqlite database file.

Under Windows, it is saved under the C:Documents and SettingsUser NameLocal SettingsApplication DataGoogleChromeUser DataDefaultLocal Storage path (where User Name refers to the current user name);

Under Mac, it is saved under /Users/User Name
under the /Library/Application Support/Google/Chrome/Default/Local Storage path (where User Name refers to the current user name). Although the suffix is ​​.localstorege, it is actually a sqlite database file. You can use sqlite Open it and see the data inside. (You can use the SQLite Manager add-on component of firefox to open it)
The steps to install the component are similar to installing firebug. Select menu tools--> attachment components, open the attachment component settings page, search for the "SQLite Manager" keyword, and install "SQLite Manager" "After plug-in, restart firefox, you can see the "SQLite Manager" add-on in the tool, as shown in the picture below:
The picture below is to view the local data file just saved


The picture below is Several commonly used localStorage methods:
1. Add localStorage

XML/HTML Code

Copy content to clipboard

1. localStorage.setItem("key","value"); //Storage a value "value" with "key" as the name

2. Get localStorage

XML/HTML Code

Copy content to clipboard

1. localStorage.getItem("key"); //Get the value named "key"

3. Delete localStorage

XML/HTML Code

Copy content to clipboard

1. localStorage.removeItem("key"); //Delete the information named "key"

4. Clear localStorage

XML/HTML Code

Copy content to clipboard

1. localStorage.clear(); //Clear all information in localStorage

5. View saved localStorage

You can view it through the chrome browser’s console tool Resource–Local Storage