Syntax error HTML DOM Local Storage clear() method

HTML DOM Local Storage clear() method



The HTML DOM Local Storage clear() method is used for clearing the whole local storage entries.

Syntax

Following is the syntax −

localStorage.clear()

Or

sessionStorage.clear()

Example

Let us see an example for LocalStorage() method property −

 Live Demo

<!DOCTYPE html>
<html>
<head>
<title>LocalStorage clear()</title>
<style>
   form {
      width:70%;
      margin: 0 auto;
      text-align: center;
   }
   * {
      padding: 2px;
      margin:5px;
   }
   input[type="button"] {
      border-radius: 10px;
   }
   table,th,td {
      border:1px solid black;
      border-collapse: collapse;
      margin: 0 auto;
   }
</style>
</head>
<body>
<form>
<fieldset>
<legend>LocalStorage clear( )</legend>
<table>
<tr>
<th>Key</th>
<th>Value</th>
</tr>
<tr>
<td>PassKey</td>
<td>ja12ertplo</td>
</tr>
</table>
<input type="button" value="Store Key" onclick="storeData()">
<input type="button" value="Delete Key" onclick="clearData()">
<div id="divDisplay"></div>
</fieldset>
</form>
<script>
   var divDisplay = document.getElementById("divDisplay");
   var extStyle = document.getElementById("extStyle");
   function clearData(){
      localStorage.clear();
      divDisplay.textContent = 'Succesfully Deleted';
   }
   function storeData(){
      localStorage.setItem('PassKey','ja12ertplo');
      divDisplay.textContent = 'Succesfully Stored';
   }
</script>
</body>
</html>

Output

This will produce the following output −

After clicking ‘Store Key’ button −

After clicking ‘Delete Key’ button −

Updated on: 2019-07-30T22:30:26+05:30

294 Views

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements