From 65b3fb514ec02aff7934fb07c0c2a5c6993c49ed Mon Sep 17 00:00:00 2001 From: Masahiro FUJIMOTO Date: Tue, 6 Apr 2021 01:16:24 +0900 Subject: Web/API/DOMTokenList/forEach を新規翻訳 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 2021/02/20 時点の英語版に基づき新規翻訳 --- files/ja/web/api/domtokenlist/foreach/index.html | 113 +++++++++++++++++++++++ 1 file changed, 113 insertions(+) create mode 100644 files/ja/web/api/domtokenlist/foreach/index.html (limited to 'files/ja/web/api/domtokenlist') diff --git a/files/ja/web/api/domtokenlist/foreach/index.html b/files/ja/web/api/domtokenlist/foreach/index.html new file mode 100644 index 0000000000..02c8c7701f --- /dev/null +++ b/files/ja/web/api/domtokenlist/foreach/index.html @@ -0,0 +1,113 @@ +--- +title: DOMTokenList.forEach() +slug: Web/API/DOMTokenList/forEach +tags: +- DOM +- DOMTokenList +- Iterable +- Method +- Reference +- Web +- forEach +translation_of: Web/API/DOMTokenList/forEach +--- +

{{APIRef("DOM")}}

+ +

forEach() は {{domxref("DOMTokenList")}} インターフェイスのメソッドで、リスト中のそれぞれの値の組に対して挿入順で 1 回ずつ、引数で渡されたコールバックを呼び出します。

+ +

構文

+ +
tokenList.forEach(callback [, thisArg]);
+
+ +

引数

+ +
+
callback
+
それぞれの要素に対して呼び出す関数で、 3 つの引数を取ります。 +
+
currentValue
+
配列内で処理中の現在の要素です。
+
currentIndex
+
配列内で処理中の現在の要素の位置です。
+
listObj
+
forEach() を実行中の配列です。
+
+
+
thisArg {{Optional_inline}}
+
callback を実行する際に {{jsxref("this")}} として使用する値です。 +
+
+ +

返値

+ +

{{jsxref('undefined')}}.

+ +

例

+ +

次の例では、 {{htmlelement("span")}} 要素に設定されたクラスのリストを DOMTokenList として受け取るのに {{domxref("Element.classList")}} を使用しています。 forEach() を使用して値を含む反復子を取得し、それぞれの値を <span> の {{domxref("Node.textContent")}} に forEach() の中の関数から書き込みます。

+ +

HTML

+ +
<span class="a b c"></span>
+ +

JavaScript

+ +
let span = document.querySelector("span");
+let classes = span.classList;
+let iterator = classes.values();
+
+classes.forEach(
+  function(value, key, listObj) {
+    span.textContent += `${value} ${key}/${this}  ++  `;
+  },
+  "arg"
+);
+ +

結果

+ +

{{ EmbedLiveSample('Example', '100%', 60) }}

+ +

ポリフィル

+ +

この{{Glossary("Polyfill","ポリフィル")}}は、 ES5 に対応しているすべてのブラウザーに互換性を追加します。

+ +
if (window.DOMTokenList && !DOMTokenList.prototype.forEach) {
+  DOMTokenList.prototype.forEach = function (callback, thisArg) {
+    thisArg = thisArg || window;
+    for (var i = 0; i < this.length; i++) {
+      callback.call(thisArg, this[i], i, this);
+    }
+  };
+}
+
+ +

仕様書

+ + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName('DOM WHATWG','#domtokenlist','forEach() (as iterable<Node>)')}} + {{Spec2('DOM WHATWG')}}初回定義
+ +

ブラウザーの互換性

+ +

{{Compat("api.DOMTokenList.forEach")}}

+ +

関連情報

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