WebStorage — это интерфейс к хранилищу пар «ключ/значение» на стороне браузера. В настоящий момент его реализуют два объекта.
Объект Session Storage сохраняет данные в контексте сеанса работы пользователя (сессии). На практике это обозначает, что данные хранятся до закрытия окна или вкладки браузера. Работа с Session Storage осуществляется посредством следующих методов:
SessionStorage. setItem(‘name’,’Vasya’);
Var name = sessionStorage. getItem(‘name’); sessionStorage. removeItem(‘name’);
Объект Local Storage хранит данные в контексте домена, «запоминая» их между сеансами. Методы у него, естественно, такие же:
Var name = localStorage. getItem(‘title’); localStorage. removeItem(‘title’);
Кроме того, оба объекта имеют метод clear() для удаления всех пар «ключ/значение» и свойство length, представляющее собой количество сохраненных пар (правда, не следует рассматривать объект Local Storage как массив).
Еще один интерфейс — WebStorage Event — определяет событие storage, возникающее при изменении состояния хранилища (setItem() или clear()). Объект Storage Event предоставляет следующие свойства события:
— key — ключ, затронутый изменением;
— oldValue — старое значение ключа;
— newValue — новое значение ключа;
— url — адрес страницы на сервере;
— storageArea — тип хранилища (Session Storage или Local Stotage).
Доступ к этим свойствам можно получить следующим образом:
<body onstorage = ‘storageInfo()’ >
<script>
Function storageInfo(e){
Var message = ‘Страница ‘+e. url+ ‘ поменяла значение ‘+e. key; message += ‘ с ‘+e. oldValue+’ на ‘+e. newValue; console. log(message):
}
</script>
</body>
Впрочем, на хранилище пар «ключ/значение» возможности HTML5 по сохранению информации на стороне клиента не заканчиваются. Для хранения структурированных данных предназначена технология WebSQL.
Добавить комментарий