Retrieve element from local storage in JavaScript?

Javascript Object Oriented Programming Front End Technology

To retrieve an element from the local storage we have to check whether the browser endorses the local storage or not. Later, we have to set an element in the local storage. At this moment we have to be careful because once the browser is closed, no data will be stored in the local storage. Later on, we need to retrieve the data that is stored in the local storage. Let's discuss it in a nutshell.

To set data in the local storage the following is the syntax

localStorage.setItem();

Example

In the following example, initially, the Compatability of the storage is checked, using if condition. Later on, using localStorage.setItem() an item is placed in the local storage. Once the item is in the local storage, using the property localStorage.getItem() the data is retrieved.

Live Demo

<html>
<body>
<p id = "storage"></p>
<script>
   if (typeof(Storage) !== "undefined") {
      localStorage.setItem("product", "Tutorix");
      document.getElementById("storage").innerHTML = localStorage.getItem("product");
   }
   else {
      document.getElementById("storage").innerHTML = "Sorry, no Web Storage compatibility...";
   }
</script>
</body>
</html>

Output

Tutorix

vineeth.mariserla

Updated on 06-Aug-2020 10:12:46

Previous Page Print Page Next Page