HTML and CSS Reference
In-Depth Information
Fortunately, we have better options with HTML5: the Web Storage specification. It defines
two
window
attributes for storing data locally on the client:
localStorage
and
ses-
sionStorage
. The
localStorage
attribute allows you to store data that will persist
on the client machine between sessions. The data can be overwritten or erased only by the
application itself or by the user performing a manual clear down of the local storage area.
The API of the
sessionStorage
attribute is identical to that of the
localStorage
attribute, but
sessionStorage
won't persist data between browser sessions, so if the
user closes the browser, the data is immediately erased.
Tip
You can try
sessionStorage
in this section by replacing any reference to
localSt-
orage
with
sessionStorage
in the listing to come.
In this section, you'll learn
• How to read data from
localStorage
• How to write data to
localStorage
• How to delete some or all data from
localStorage
To implement the management of the application's settings using the Web Storage API and
to integrate the setting functions with the UI, you'll need to follow these four steps:
• Step 1: Read application settings from
localStorage.
• Step 2: Save application settings to
localStorage.
• Step 3: Clear all settings and data from
localStorage.
• Step 4: Connect the UI to
localStorage
functions.
Note
You need to complete all the steps before you can run and test the code in this section.