From 33058f2b292b3a581333bdfb21b8f671898c5060 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:40:17 -0500 Subject: initial commit --- files/ja/web/api/storage/clear/index.html | 67 ++++++++++++ files/ja/web/api/storage/getitem/index.html | 141 +++++++++++++++++++++++++ files/ja/web/api/storage/index.html | 106 +++++++++++++++++++ files/ja/web/api/storage/key/index.html | 130 +++++++++++++++++++++++ files/ja/web/api/storage/length/index.html | 126 ++++++++++++++++++++++ files/ja/web/api/storage/removeitem/index.html | 75 +++++++++++++ files/ja/web/api/storage/setitem/index.html | 139 ++++++++++++++++++++++++ 7 files changed, 784 insertions(+) create mode 100644 files/ja/web/api/storage/clear/index.html create mode 100644 files/ja/web/api/storage/getitem/index.html create mode 100644 files/ja/web/api/storage/index.html create mode 100644 files/ja/web/api/storage/key/index.html create mode 100644 files/ja/web/api/storage/length/index.html create mode 100644 files/ja/web/api/storage/removeitem/index.html create mode 100644 files/ja/web/api/storage/setitem/index.html (limited to 'files/ja/web/api/storage') diff --git a/files/ja/web/api/storage/clear/index.html b/files/ja/web/api/storage/clear/index.html new file mode 100644 index 0000000000..7b99c0b3f0 --- /dev/null +++ b/files/ja/web/api/storage/clear/index.html @@ -0,0 +1,67 @@ +--- +title: Storage.clear() +slug: Web/API/Storage/clear +tags: + - API + - Method + - Reference + - Storage + - Web Storage +translation_of: Web/API/Storage/clear +--- +

{{APIRef("Web Storage API")}}

+ +

clear() は {{domxref("Storage")}} インターフェイスのメソッドで、指定された Storage オブジェクトに格納されているすべてのキーを消去します。

+ +

構文

+ +
storage.clear();
+ +

返値

+ +

{{jsxref("undefined")}} です。

+ +

例

+ +

以下の関数はローカルストレージに 3 個のデータアイテムを作成して、 clear() を使用してすべて削除します。

+ +
function populateStorage() {
+  localStorage.setItem('bgcolor', 'red');
+  localStorage.setItem('font', 'Helvetica');
+  localStorage.setItem('image', 'miGato.png');
+
+  localStorage.clear();
+}
+ +
+

注: 実際の例としては、 Web Storage Demo をご覧ください。

+
+ +

仕様書

+ + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName('HTML WHATWG', 'webstorage.html#dom-storage-clear', 'Storage.clear')}}{{Spec2('HTML WHATWG')}}
+ +

ブラウザーの互換性

+ + + +

{{Compat("api.Storage.clear")}}

+ +

関連情報

+ +

Web Storage API の使用

diff --git a/files/ja/web/api/storage/getitem/index.html b/files/ja/web/api/storage/getitem/index.html new file mode 100644 index 0000000000..249dd1ad12 --- /dev/null +++ b/files/ja/web/api/storage/getitem/index.html @@ -0,0 +1,141 @@ +--- +title: Storage.getItem() +slug: Web/API/Storage/getItem +tags: + - API + - Method + - Reference + - Storage + - Web Storage +translation_of: Web/API/Storage/getItem +--- +

{{APIRef("Web Storage API")}}

+ +

{{domxref("Storage")}} インターフェイスの getItem() メソッドはキーの名称を渡すと、そのキーに対する値を返します。

+ +

構文

+ +
var aValue = storage.getItem(keyName);
+
+ +

引数

+ +
+
keyName
+
値を取り出したいキーの名称を持つ {{domxref("DOMString")}}。
+
+ +

戻り値

+ +

キーに対する値を持つ {{domxref("DOMString")}}。キーが存在しない場合は null が返ります。

+ +

例

+ +

以下の関数はローカルストレージから 3 個のデータアイテムを取り出して、その値を使用してページのカスタムスタイルを設定します。

+ +
function setStyles() {
+  var currentColor = localStorage.getItem('bgcolor');
+  var currentFont = localStorage.getItem('font');
+  var currentImage = localStorage.getItem('image');
+
+  document.getElementById('bgcolor').value = currentColor;
+  document.getElementById('font').value = currentFont;
+  document.getElementById('image').value = currentImage;
+
+  htmlElem.style.backgroundColor = '#' + currentColor;
+  pElem.style.fontFamily = currentFont;
+  imgElem.setAttribute('src', currentImage);
+}
+ +
+

注記: 実際の例として、Web Storage Demo をご覧ください。

+
+ +

仕様

+ + + + + + + + + + + + + + +
仕様書策定状況コメント
{{SpecName('Web Storage', '#dom-storage-getitem', 'getItem()')}}{{Spec2('Web Storage')}}
+ +

ブラウザ実装状況

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
機能ChromeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
localStorage43.5810.504
sessionStorage52810.504
+
+ +
+ + + + + + + + + + + + + + + + + + + +
機能AndroidFirefox Mobile (Gecko)IE PhoneOpera MobileSafari Mobile
基本サポート2.1{{CompatUnknown}}811iOS 3.2
+
+ +

すべてのブラウザで、localStorage および sessionStorage が受け入れる容量は異なります。さまざまなブラウザのストレージ容量を報告しているページがあります。

+ +
+

注記: iOS 5.1 より Safari Mobile は localStorage データを cache フォルダに保存しており、概して空き容量が少ない場合に OS の要求により、時々クリーンアップを受けます。

+
+ｓ +

関連情報

+ + diff --git a/files/ja/web/api/storage/index.html b/files/ja/web/api/storage/index.html new file mode 100644 index 0000000000..6fff08958a --- /dev/null +++ b/files/ja/web/api/storage/index.html @@ -0,0 +1,106 @@ +--- +title: Storage +slug: Web/API/Storage +tags: + - API + - Interface + - Reference + - Storage + - Web Storage + - data +translation_of: Web/API/Storage +--- +

{{APIRef("Web Storage API")}}

+ +

Web Storage API の Storage インターフェイスは、特定のドメインのセッションストレージまたはローカルストレージへのアクセス機能を提供して、例えば保存されているデータアイテムを追加、変更、削除することができます。

+ +

ドメインのセッションストレージを操作したい場合は、{{domxref("Window.sessionStorage")}} メソッドを呼び出してください。ドメインのローカルストレージを操作したい場合は、{{domxref("Window.localStorage")}} を呼び出してください。

+ +

プロパティ

+ +
+
{{domxref("Storage.length")}} {{readonlyInline}}
+
Storage オブジェクトに保存されているデータアイテムの数を表す整数を返します。
+
+ +

メソッド

+ +
+
{{domxref("Storage.key()")}}
+
このメソッドは数値 n を渡すと、ストレージ内で n 番目のキーの名称を返します。
+
+ +
+
{{domxref("Storage.getItem()")}}
+
キーの名称を渡すと、キーに対する値を返します。
+
{{domxref("Storage.setItem()")}}
+
キーの名称と値を渡すと、ストレージにキーを追加する、または既存のキーに対する値を更新します。
+
{{domxref("Storage.removeItem()")}}
+
キーの名称を渡すと、ストレージからキーを削除します。
+
{{domxref("Storage.clear()")}}
+
このメソッドを呼び出すと、ストレージからすべてのキーを消去します。
+
+ +

例

+ +

ここでは、localStorage を呼び出して Storage オブジェクトにアクセスしています。始めに !localStorage.getItem('bgcolor') というコードを使用して、ローカルストレージにデータアイテムが含まれているかを確認します。含まれている場合は、{{domxref("Storage.getItem()")}} を使用してデータアイテムを取得して、さらにそのデータを使用してページのスタイルを更新する setStyles() 関数を実行します。含まれていない場合は populateStorage() 関数を実行します。こちらは {{domxref("Storage.setItem()")}} を使用してアイテムの値を設定してから、setStyles() を実行します。

+ +
if(!localStorage.getItem('bgcolor')) {
+  populateStorage();
+}
+setStyles();
+
+function populateStorage() {
+  localStorage.setItem('bgcolor', document.getElementById('bgcolor').value);
+  localStorage.setItem('font', document.getElementById('font').value);
+  localStorage.setItem('image', document.getElementById('image').value);
+}
+
+function setStyles() {
+  var currentColor = localStorage.getItem('bgcolor');
+  var currentFont = localStorage.getItem('font');
+  var currentImage = localStorage.getItem('image');
+
+  document.getElementById('bgcolor').value = currentColor;
+  document.getElementById('font').value = currentFont;
+  document.getElementById('image').value = currentImage;
+
+  htmlElem.style.backgroundColor = '#' + currentColor;
+  pElem.style.fontFamily = currentFont;
+  imgElem.setAttribute('src', currentImage);
+}
+ +
+

注意: 完全に動作する例として実行する様子を見るために、Web Storage Demo をご覧ください。

+
+ +

仕様

+ + + + + + + + + + + + + + +
仕様書策定状況コメント
{{SpecName('HTML WHATWG', 'webstorage.html#the-storage-interface', 'Storage')}}{{Spec2('HTML WHATWG')}} 
+ +

ブラウザ実装状況

+ + + +

{{Compat("api.Storage")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/storage/key/index.html b/files/ja/web/api/storage/key/index.html new file mode 100644 index 0000000000..6fc7067247 --- /dev/null +++ b/files/ja/web/api/storage/key/index.html @@ -0,0 +1,130 @@ +--- +title: Storage.key() +slug: Web/API/Storage/key +tags: + - API + - Method + - Reference + - Storage + - Web Storage +translation_of: Web/API/Storage/key +--- +

{{APIRef}}

+ +

{{domxref("Storage")}} インターフェイスの key() メソッドは数値 n を渡すと、ストレージ内で n 番目のキーの名称を返します。キーの順序はユーザエージェント依存であり、この順序に頼るべきではありません。

+ +

構文

+ +
var aKeyName = storage.key(key);
+ +

引数

+ +
+
key
+
名称を取得したいキーの番号を表す整数。これは 0 から始まるインデックスです。
+
+ +

戻り値

+ +

キーの名称を持つ {{domxref("DOMString")}}。

+ +

例

+ +

以下の関数は、ローカルストレージのキー全体に対して反復処理を行います:

+ +
function forEachKey(callback) {
+  for (var i = 0; i < localStorage.length; i++) {
+    callback(localStorage.key(i));
+  }
+}
+ +
+

注記: 実際の例として、Web Storage Demo をご覧ください。

+
+ +

仕様

+ + + + + + + + + + + + + + +
仕様書策定状況コメント
{{SpecName('Web Storage', '#dom-storage-key', 'key()')}}{{Spec2('Web Storage')}} 
+ +

ブラウザ実装状況

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
機能ChromeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
localStorage43.5810.504
sessionStorage52810.504
+
+ +
+ + + + + + + + + + + + + + + + + + + +
機能AndroidFirefox Mobile (Gecko)IE PhoneOpera MobileSafari Mobile
基本サポート2.1{{CompatUnknown}}811iOS 3.2
+
+ +

すべてのブラウザで、localStorage および sessionStorage が受け入れる容量は異なります。さまざまなブラウザのストレージ容量を報告しているページがあります。

+ +
+

注記: iOS 5.1 より Safari Mobile は localStorage データを cache フォルダに保存しており、概して空き容量が少ない場合に OS の要求により、時々クリーンアップを受けます。

+
+ +

関連情報

+ + diff --git a/files/ja/web/api/storage/length/index.html b/files/ja/web/api/storage/length/index.html new file mode 100644 index 0000000000..5263fdcc39 --- /dev/null +++ b/files/ja/web/api/storage/length/index.html @@ -0,0 +1,126 @@ +--- +title: Storage.length +slug: Web/API/Storage/length +tags: + - API + - Property + - Read-only + - Reference + - Storage + - Web Storage +translation_of: Web/API/Storage/length +--- +

{{APIRef("Web Storage API")}}

+ +

{{domxref("Storage")}} インターフェイスの読み取り専用プロパティ length は、Storage オブジェクトに保存されているデータアイテムの数を表す整数を返します。

+ +

構文

+ +
var aLength = storage.length;
+ +

戻り値

+ +

整数

+ +

例

+ +

以下の関数はカレントドメインのローカルストレージに 3 個のデータアイテムを追加して、ストレージ内のアイテムの数を返します:

+ +
function populateStorage() {
+  localStorage.setItem('bgcolor', 'yellow');
+  localStorage.setItem('font', 'Helvetica');
+  localStorage.setItem('image', 'cats.png');
+
+  localStorage.length; // 3 を返す
+}
+ +
+

注記: 実際の例として、Web Storage Demo をご覧ください。

+
+ +

仕様

+ + + + + + + + + + + + + + +
仕様書策定状況コメント
{{SpecName('Web Storage', '#dom-storage-length', 'length')}}{{Spec2('Web Storage')}} 
+ +

ブラウザ実装状況

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
機能ChromeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
localStorage43.5810.504
sessionStorage52810.504
+
+ +
+ + + + + + + + + + + + + + + + + + + +
機能AndroidFirefox Mobile (Gecko)IE PhoneOpera MobileSafari Mobile
基本サポート2.1{{CompatUnknown}}811iOS 3.2
+
+ +

すべてのブラウザで、localStorage および sessionStorage が受け入れる容量は異なります。さまざまなブラウザのストレージ容量を報告しているページがあります。

+ +
+

注記: iOS 5.1 より Safari Mobile は localStorage データを cache フォルダに保存しており、概して空き容量が少ない場合に OS の要求により、時々クリーンアップを受けます。

+
+ +

関連情報

+ + diff --git a/files/ja/web/api/storage/removeitem/index.html b/files/ja/web/api/storage/removeitem/index.html new file mode 100644 index 0000000000..afe197534b --- /dev/null +++ b/files/ja/web/api/storage/removeitem/index.html @@ -0,0 +1,75 @@ +--- +title: Storage.removeItem() +slug: Web/API/Storage/removeItem +tags: + - API + - Method + - Reference + - Référence(2) + - Storage + - Web Storage +translation_of: Web/API/Storage/removeItem +--- +
{{APIRef("Web Storage API")}}
+ +

{{domxref("Storage")}} インターフェイスの removeItem() メソッドは、キーの名称を渡すと、指定された Storage からキーを削除します。指定されたキーに関連付けられた項目がない場合、このメソッドは何もしません。

+ +

構文

+ +
storage.removeItem(keyName);
+ +

引数

+ +
+
keyName
+
削除したいキーの名称を持つ {{domxref("DOMString")}}。
+
+ +

返値

+ +

{{jsxref("undefined")}}。

+ +

例

+ +

以下の関数はローカルストレージに 3 個のデータ項目を作成して、 image データ項目を削除します。

+ +
function populateStorage() {
+  localStorage.setItem('bgcolor', 'red');
+  localStorage.setItem('font', 'Helvetica');
+  localStorage.setItem('image', 'myCat.png');
+
+  localStorage.removeItem('image');
+}
+ +
+

メモ: 実際の例として、 Web Storage Demo をご覧ください。

+
+ +

仕様書

+ + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName('HTML WHATWG', 'webstorage.html#dom-storage-removeitem', 'Storage.removeItem')}}{{Spec2('HTML WHATWG')}}
+ +

ブラウザーの対応

+ + + +

{{Compat("api.Storage.removeItem")}}

+ +

関連情報

+ +

Web Storage API の使用

diff --git a/files/ja/web/api/storage/setitem/index.html b/files/ja/web/api/storage/setitem/index.html new file mode 100644 index 0000000000..3cff60fbdc --- /dev/null +++ b/files/ja/web/api/storage/setitem/index.html @@ -0,0 +1,139 @@ +--- +title: Storage.setItem() +slug: Web/API/Storage/setItem +tags: + - API + - Method + - Reference + - Storage + - Web Storage +translation_of: Web/API/Storage/setItem +--- +

{{APIRef("Web Storage API")}}

+ +

{{domxref("Storage")}} インターフェイスの setItem() メソッドはキーの名称と値を渡すと、ストレージにキーを追加する、またはキーがすでに存在する場合はキーに対する値を更新します。

+ +

構文

+ +
storage.setItem(keyName, keyValue);
+ +

引数

+ +
+
keyName
+
作成または更新したいキーの名称を持つ {{domxref("DOMString")}}。
+
keyValue
+
作成または更新するキーに対して渡したい値を持つ {{domxref("DOMString")}}。
+
+ +

戻り値

+ +

戻り値なし。

+ +

例外

+ +

setItem() は、ストレージが満杯である場合に例外が発生します。特に Mobile Safari (iOS 5 以降) では、ユーザがプライベートモードに入っているときに必ず例外が発生します (Safari はプライベートモードで、クォータを 0 バイトに設定します。一方他のブラウザは別のデータコンテナを使用して、プライベートモードでもストレージを使用できます)。
+ 従って開発者は、setItem() で発生する可能性がある例外を常にキャッチするようにしてください。

+ +

例

+ +

以下の関数はローカルストレージに 3 個のデータアイテムを作成します。

+ +
function populateStorage() {
+  localStorage.setItem('bgcolor', 'red');
+  localStorage.setItem('font', 'Helvetica');
+  localStorage.setItem('image', 'myCat.png');
+}
+ +
+

注記: 実際の例として、Web Storage Demo をご覧ください。

+
+ +

仕様

+ + + + + + + + + + + + + + +
仕様書策定状況コメント
{{SpecName('Web Storage', '#dom-storage-setitem', 'setItem()')}}{{Spec2('Web Storage')}}
+ +

ブラウザ実装状況

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
機能ChromeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
localStorage43.5810.504
sessionStorage52810.504
+
+ +
+ + + + + + + + + + + + + + + + + + + +
機能AndroidFirefox Mobile (Gecko)IE PhoneOpera MobileSafari Mobile
基本サポート2.1{{CompatUnknown}}811iOS 3.2
+
+ +

すべてのブラウザで、localStorage および sessionStorage が受け入れる容量は異なります。さまざまなブラウザのストレージ容量を報告しているページがあります。

+ +
+

注記: iOS 5.1 より Safari Mobile は localStorage データを cache フォルダに保存しており、概して空き容量が少ない場合に OS の要求により、時々クリーンアップを受けます。

+
+ +

関連情報

+ + -- cgit v1.2.3-54-g00ecf