The LocalStorage API provides a way to store key-value pairs in the browser. Data persists even after the browser window is closed and reopened.
// Store a single item
localStorage.setItem('username', 'John');
// Store an object
const user = {
name: 'John',
age: 30,
email: '[email protected]'
};
localStorage.setItem('user', JSON.stringify(user));
//tumhare case mei input lene ke liye
<input type="text" class="title" onchange="handleTitle(this.value)" placeholder="Enter Title">
<input type="text" class="task" onchange="handleTask(this.value)" placeholder="Enter Task">
<button onclick="handleClick()">Submit</button>
<script>
let title;
let task;
function handleTitle(event) {
title = event;
}
function handleTask(event) {
task = event;
}
function handleClick() {
if (typeof window !== 'undefined' && typeof window.localStorage !== 'undefined') {
localStorage.setItem(String(title), String(task));
console.log(localStorage.getItem(title));
} else {
console.log('localStorage is not available in this environment.');
}
}
</script>
// Get a single item
const username = localStorage.getItem('username');
console.log(username); // Output: "John"
// Get and parse an object
const storedUser = JSON.parse(localStorage.getItem('user'));
console.log(storedUser.name); // Output: "John"
// Remove a single item
localStorage.removeItem('username');
// Clear all items in localStorage
localStorage.clear();
// Get number of items in localStorage
const itemCount = localStorage.length;
console.log(itemCount);
try {
localStorage.setItem('key', 'value');
} catch (e) {
if (e.name === 'QuotaExceededError') {
console.error('LocalStorage is full');
}
}