Работаем с HTML5 localStorage

Сегодня немного погорим об одном из новшеств HTML5 — локальном хранилище или localStorage. localStorage это особая база данных, хранящая информацию в виде ключ-значение на стороне клиента. То есть в браузере. Это означает, что эти данные доступны только на конкретном компьютере и конкретном браузере. Что-то похожее на cookies.

localStorage поддерживается Safari 4+, Mobile Safari (iPhone/iPad), Firefox 3.5+, Internet Explorer 8+ и Chrome 4+. С недавних пор поддерживается и Оперой.

Теперь о работе с локальным хранилищем.

  1. if (localStorage == undefined) {
  2. alert('Ваш браузер не поддерживает HTML5 localStorage. Попробуйте обновить браузер.');
  3. } else {
  4. try {
  5. localStorage.setItem(“name”, “Hello World!); //сохраняем в хранилище данные ключ - значение
  6. } catch (e) {
  7. if (e == QUOTA_EXCEEDED_ERR) {
  8. alert('Хранилище переполнено'); //нельзя сохранить новые данные, если хранилище переполнено
  9. }
  10. }
  11.  
  12.  
  13. document.write(localStorage.getItem(“name”)); //Hello World!
  14. localStorage.removeItem(“name”); //удалить данные из хранилища
  15. }

Код включает необходимые проверки на возможность работы с localStorage, а также базовые методы для работы с ним. В будущем вернусь к этой теме, а на сегодня всё.

Запись опубликована в рубрике HTML & CSS с метками , . Добавьте в закладки постоянную ссылку.

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Можно использовать следующие HTML-теги и атрибуты: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong> <pre lang="" line="" escaped="" cssfile="">