Просмотр данных веб-SQL

Kayce Basques

В этом руководстве показано, как использовать Chrome DevTools для проверки данных Web SQL.

Просмотр данных веб-SQL

1. Перейдите на вкладку «Источники» , чтобы открыть панель «Приложение» . Разверните раздел Web SQL , чтобы просмотреть базы данных и таблицы. На рисунке 1 ниже html5meetup — это база данных, аrooms — это таблица.

   

   Рисунок 1 . Панель Веб-SQL.

2. Щелкните таблицу, чтобы просмотреть данные этой таблицы.

   

   Фигура 2 . Просмотр данных номеров из таблицы Web SQL.

Редактировать данные веб-SQL

Вы не можете редактировать данные Web SQL при просмотре таблицы Web SQL, как показано на рисунке 2 выше. Но вы можете запускать инструкции из веб-консоли SQL, которые редактируют или удаляют таблицы. См. раздел «Выполнение запросов Web SQL» .

Запуск веб-SQL-запросов

1. Щелкните базу данных, чтобы открыть консоль для этой базы данных.

2. Введите оператор Web SQL, затем нажмите Enter, чтобы запустить его.

   

   Рисунок 3 . Использование веб-консоли SQL для удаления строки из таблицы номеров .

Обновление таблицы Web SQL

DevTools не обновляет таблицы в режиме реального времени. Чтобы обновить данные в таблице:

1. Просмотр данных таблицы Web SQL .
2. Нажмите Обновить .

Отфильтровать столбцы в таблице Web SQL

1. Просмотр данных таблицы Web SQL .

2. Используйте текстовое поле «Видимые столбцы» , чтобы указать, какие столбцы вы хотите отображать. Укажите имена столбцов в виде списка CSV.

   

   Рисунок 4 . Использование текстового поля «Видимые столбцы» , чтобы отображать только столбцы room_name и last_updated .

Удалить все данные Web SQL

1. Откройте панель «Очистить хранилище» .

2. Убедитесь, что флажок Веб-SQL включен.

   

   Рисунок 5 . Флажок Веб-SQL .

3. Нажмите Очистить данные сайта .

   

   Рисунок 6 . Кнопка «Очистить данные сайта ».