dots Created with Sketch.
Yogesh Chauhan's Blog

How to create and store JSON objects in localStorage using JavaScript?

in JavaScript on July 14, 2021

This is how you can store data in browser using Storage interface of Web Storage API.


localStorage.setItem('name', 'Yogesh');

This is how you can get that stored data:


localStorage.getItem('name');

You can save that in a variable or directly print it, up to you.

If you have a form on your website and you want to save data of user inputs then you can use this function to retrieve the values and save those values in localStorage.


function saveData() {
  let name = document.getElementById("name").value;
  let email = document.getElementById("email").value;
  let address = document.getElementById("address").value;

  let data = {
    name: name,
    email: email,
    address: address,
  };

  localStorage.setItem("data", JSON.stringify(data));
}

amazon

Most Read

#1 How to check if radio button is checked or not using JavaScript? #2 Solution to “TypeError: ‘x’ is not iterable” in Angular 9 #3 How to add Read More Read Less Button using JavaScript? #4 How to uninstall Cocoapods from the Mac OS? #5 PHP Login System using PDO Part 1: Create User Registration Page #6 How to Use SQL MAX() Function with Dates?

Recently Posted

#Jul 22 Is there a CSS parent selector? #Jul 22 Difference between :where and :is in CSS #Jul 22 Does :is() pseudo selector hint at CSS preprocessing in the future? #Jul 22 Control Scrolling with CSS Scroll Snap #Jul 21 Control rendering using CSS content-visibility property #Jul 21 How to use @supports rule in CSS?
You might also like these
The SQL UNION OperatorSQL/MySQLapply_filters function in WordPressWordPressHow does Next.js load pages faster?NextJSUseful (and probably ignored) HTML tags: Part 2HTMLHow to Validate User Name, Email Address and URL in PHP?PHPfor @each loop in SCSSSCSSHow to add CurrencyPipe in TypeScript file in Angular 9 Project?AngularPHP Login System using PDO Part 2: Login using Email or UsernamePHPWordPress: How to print ACF repeater field values?WordPressHow to add today’s date in HTML input date value using JavaScript?JavaScriptHow to compress images with gulp in WordPress?WordPressCheck If a String Contains a Specific Word in PHPPHP