セッション ストレージを表示、編集する

Kayce Basques

Sofia Emelianova

このガイドでは、Chrome DevTools を使用して sessionStorage の Key-Value ペアを表示、編集、削除する方法について説明します。セッション ストレージは、ページ セッションが終了すると消去されます。

sessionStorage 個のキーと値を表示

1. 検査するウェブサイトで DevTools を開きます。

2. [アプリケーション] > [ストレージ] に移動して [セッション ストレージ] を開きます。ドメインをクリックして、その Key-Value ペアを表示します。

   

3. 表の下の値をプレビューするには、ペアを選択してください。

   

Key-Value ペアを手動で更新するには、上部のアクションバーで refresh [更新] をクリックします。

Key-Value ペアをフィルタする

必要な Key-Value ペアをすばやく見つけるには、上部にあるフィルタ ボックスに、キーまたは値のいずれかに含まれる文字列を入力します。

新しい Key-Value ペア sessionStorage を作成する

1. ドメインの sessionStorage の Key-Value ペアを表示する。（例: こちらのデモページ）。
2. 表の空の部分をダブルクリックします。DevTools によって新しい行が作成され、[Key] 列にカーソルがフォーカスされます。
3. 新しい Key-Value ペアを入力します。

sessionStorage 個のキーまたは値を編集

1. ドメインの sessionStorage の Key-Value ペアを表示する。（例: こちらのデモページ）。
2. [キー] 列または [値] 列のセルをダブルクリックして、そのキーまたは値を編集します。
3. ページを更新して適用してください。

sessionStorage 個の Key-Value ペアを削除します

1. ドメインの sessionStorage の Key-Value ペアを表示する。（例: こちらのデモページ）。
2. Key-Value ペアをクリックして選択します。
3. 上部のアクションバーで [ Delete] をクリックして、選択したペアを削除します。
4. または、[ すべてクリア] をクリックして、すべてのペアを削除します。

コンソールから sessionStorage を操作する

JavaScript はコンソールで実行でき、コンソールはページの JavaScript コンテキストにアクセスできるため、sessionStorage はコンソールから操作できます。

1. DevTools でコンソールを開きます。
2. 表示しているページ以外のドメインの sessionStorage Key-Value ペアにアクセスする場合は、上部のアクションバーにあるコンテキスト プルダウン メニューから、必要な JavaScript コンテキストを選択します。
3. JavaScript の場合と同様に、コンソールで sessionStorage 式を実行します。