Web SQL データを表示する

Kayce Basques

このガイドでは、Chrome DevTools を使用して Web SQL データを検査する方法について説明します。

ウェブ SQL データを表示する

1. [ソース] タブをクリックして [アプリケーション] パネルを開きます。[Web SQL] セクションを開いて、データベースとテーブルを表示します。下の 図 1 では、html5meetup がデータベースで、rooms がテーブルです。

   

   図 1. [Web SQL] ペイン。

2. テーブルをクリックして、そのテーブルのデータを表示します。

   

   図 2. rooms Web SQL テーブルのデータを表示しています。

ウェブ SQL データを編集する

上記の 図 2 のように、Web SQL テーブルを表示しているときに Web SQL データを編集することはできません。ただし、テーブルを編集または削除するステートメントは、Web SQL コンソールから実行できます。Web SQL クエリを実行するをご覧ください。

Web SQL クエリを実行する

1. データベースをクリックして、そのデータベースのコンソールを開きます。

2. Web SQL ステートメントを入力し、Enter キーを押して実行します。

   

   図 3. Web SQL コンソールを使用して、rooms テーブルから行を削除します。

Web SQL テーブルを更新する

DevTools ではテーブルはリアルタイムで更新されません。テーブルのデータを更新するには:

1. Web SQL テーブルのデータを表示する。
2. 更新アイコン をクリックします。

Web SQL テーブルの列を除外する

1. Web SQL テーブルのデータを表示する。

2. [表示される列] テキスト ボックスを使用して、表示する列を指定します。列名を CSV リストとして指定します。

   

   図 4. [Visible Columns] テキスト ボックスを使用して、room_name 列と last_updated 列のみを表示します。

Web SQL のデータをすべて削除する

1. [ストレージの消去] ペインを開きます。

2. [Web SQL] チェックボックスがオンになっていることを確認します。

   

   図 5. [Web SQL] チェックボックス。

3. [サイトデータを消去する] をクリックします。

   

   図 6. [サイトデータを消去] ボタン。