How to make the session storage remember the result of click? Now it's now working and I don't know why.
I want to add a key to the session, and when the key is in the session, the popup is not shown.
Thank you in advance!
let object = document.querySelector('.object');
let tap = document.querySelector('.tap');
function addSessionKey() {
sessionStorage.setItem('hide', true);
}
function hideObject() {
for(let i=0; i<sessionStorage.length; i++) {
let key = sessionStorage.key(i);
object.classList.add('none');
}
hideObject();
}
tap.addEventListener('click', addSessionKey);
tap.addEventListener('click', hideObject);section {
height: 100vh;
background: #ccc;
display: flex;
align-items: center;
justify-content: center;
}
div {
padding: 1rem 3rem;
background: #999;
}
bottom {
display: block;
padding: 1rem;
background: #666;
cursor: pointer;
}
.object.none {
display: none;
}<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<section>
<div class="object">
<h2>Object</h2>
<bottom class="tap">Tap</bottom>
</div>
</section>
</body>
</html>