Веб хранилище API HTML
LocalStorage и SessionStorage в HTML
Хранение данных на стороне клиента.
Пример использования:
<div>
<input type="text" id="username" placeholder="Введите имя">
<button onclick="saveData()">Сохранить</button>
<button onclick="loadData()">Загрузить</button>
<button onclick="clearData()">Очистить</button>
</div>
<div id="display"></div>
<script>
// Сохранение данных
function saveData() {
const username = document.getElementById("username").value;
localStorage.setItem("username", username);
sessionStorage.setItem("sessionData", "Сессионные данные");
alert("Данные сохранены!");
}
// Загрузка данных
function loadData() {
const username = localStorage.getItem("username");
const sessionData = sessionStorage.getItem("sessionData");
document.getElementById("display").innerHTML =
`LocalStorage: ${username || "нет данных"}<br>` +
`SessionStorage: ${sessionData || "нет данных"}`;
}
// Очистка данных
function clearData() {
localStorage.removeItem("username");
sessionStorage.clear();
document.getElementById("display").innerHTML = "Данные очищены!";
}
// Автозагрузка при загрузке страницы
window.onload = loadData;
</script>