quick-musician-29561
01/17/2024, 6:27 AMhtml
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>SessionStorage Example</title>
<script>
const saveMessage = () => {
const message = document.getElementById('messageInput').value;
sessionStorage.setItem('userMessage', message);
console.log('Message saved to sessionStorage:', message);
};
window.addEventListener('beforeunload', () => {
sessionStorage.clear();
console.log('SessionStorage cleared.');
});
</script>
</head>
<body>
<h1>SessionStorage Example</h1>
<label for="messageInput">Enter a message:</label>
<input type="text" id="messageInput">
<button onclick="saveMessage()">Save Message</button>
<div>
<h2>Stored Message:</h2>
<p id="storedMessage"></p>
<button onclick="displayStoredMessage()">Show Stored Message</button>
</div>
<script>
const displayStoredMessage = () => {
const storedMessage = sessionStorage.getItem('userMessage');
if (storedMessage) {
document.getElementById('storedMessage').innerText = storedMessage;
console.log('Displayed stored message:', storedMessage);
}
};
window.onload = () => {
const storedMessage = sessionStorage.getItem('userMessage');
if (storedMessage) {
document.getElementById('storedMessage').innerText = storedMessage;
console.log('Retrieved stored message from sessionStorage:', storedMessage);
}
};
</script>
</body>
</html>
https://jsfiddle.net/devmik/fwoLak49/1/