Просмотр и редактирование локального хранилища

Kayce Basques

Sofia Emelianova

В этом руководстве показано, как использовать Chrome DevTools для просмотра, редактирования и удаления пар «ключ-значение» localStorage . Локальное хранилище сохраняет данные во время сеансов браузера.

Просмотр ключей и значений localStorage

1. Откройте DevTools на веб-сайте, который вы хотите проверить.

2. Перейдите в «Приложение» > «Хранилище» и разверните «Локальное хранилище» . Щелкните домен, чтобы просмотреть его пары «ключ-значение».

   

3. Чтобы просмотреть значение под таблицей, выберите пару.

   

Чтобы вручную обновить пары ключ-значение, нажмите Обновите панель действий вверху.

Фильтрация пар ключ-значение

Чтобы быстро найти нужную пару ключ-значение, введите в поле фильтра вверху строку, содержащую ключ или значение.

Создайте новую пару ключ-значение localStorage

1. Просмотрите пары «ключ-значение localStorage домена . Например, на этой демонстрационной странице .
2. Дважды щелкните пустую часть таблицы. DevTools создает новую строку и фокусирует курсор в столбце «Ключ» .
3. Введите новую пару ключ-значение.

Редактировать ключи или значения localStorage

1. Просмотр пар «ключ-значение localStorage домена . Например, на этой демонстрационной странице .
2. Дважды щелкните ячейку в столбце «Ключ или значение» , чтобы изменить этот ключ или значение.
3. Обновите страницу, чтобы подать заявку.

Удаление пар ключ-значение localStorage

1. Просмотр пар «ключ-значение localStorage домена . Например, на этой демонстрационной странице .
2. Щелкните пару ключ-значение, чтобы выбрать ее.
3. Нажмите Удалить на панели действий вверху, чтобы удалить выбранную пару.
4. Альтернативно нажмите Очистить все , чтобы удалить все пары.

Взаимодействие с localStorage из консоли

Поскольку вы можете запускать JavaScript в Console и поскольку консоль имеет доступ к контекстам JavaScript страницы, можно взаимодействовать с localStorage из Console .

1. В DevTools откройте консоль .
2. Если вы хотите получить доступ к парам «ключ-значение» localStorage домена, отличного от страницы, на которой вы находитесь, выберите нужный контекст JavaScript в раскрывающемся меню контекста на панели действий вверху.
3. Запустите выражения localStorage в консоли так же, как и в JavaScript.