Home > Web Front-end > H5 Tutorial > Parsing new features in HTML5 local storage localStorage_html5 tutorial tips

Parsing new features in HTML5 local storage localStorage_html5 tutorial tips

WBOY
Release: 2016-05-16 15:45:52
Original
1794 people have browsed it

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

JavaScript CodeCopy content to clipboard
  1.  
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: 201631112517056.png (1024×496)
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


Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template