JavaScriptでのDOM操作のためのコールバック渡し

いくつかのDOM要素のグループがあるとします：

<p class="elem">1</p>
<p class="elem">2</p>
<p class="elem">3</p>
<p class="elem">4</p>
<p class="elem">5</p>

関数 forEach を作成しましょう。この関数は第一引数に要素グループのセレクタを受け取り、第二引数にコールバック関数を受け取ります。このコールバックは、見つかった各要素に順番に適用されます：

forEach('.elem', function() {
	// 関数は各要素に適用されます
});

セレクタに一致した要素が、コールバックの第一引数に順番に入るようにしましょう：

forEach('.elem', function(elem) {
	console.log(elem); // 見つかった要素を順番に出力します
});

作成した関数を使用して、クラス elem を持つすべての要素を見つけ、各要素のテキストを2乗するコールバックを適用してみましょう：

forEach('.elem', function(elem) {
	elem.textContent = elem.textContent ** 2;
});

次に、私たちが考えた関数 forEach の実装を記述しましょう：

function forEach(selector, func) {
	let elems = document.querySelectorAll(selector);
	
	for (let elem of elems) {
		func(elem);
	}
}

いくつかの段落があります。私たちが作成した関数 forEach を使用して、各段落のテキストの末尾に感嘆符を追加してください。