<label>Option 1<input type="checkbox" name="opt1"></label>
<label>Option 2<input type="checkbox" name="opt2" checked></label>
<label>Option 3<input type="checkbox" name="opt3"></label>
<label>Option 4<input type="checkbox" name="opt4" checked></label>
<button>Read localStorage</button>
localStorage.clear();
let c = document.querySelectorAll("input");
c.forEach((item) => localStorage.setItem(item.name, item.checked));
document.querySelector("button").addEventListener("click", readStore);
function readStore() {
for (const [key, value] of Object.entries(localStorage)) {
if(value=='true') console.log(`${key}: ${value}`);
}
}
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.