関数パラメータとしてのDOM要素グループの渡し方
では、私たちの関数 setText が
最初のパラメータとして、単一の要素への参照ではなく、
要素のセットをすぐに受け取るようにしましょう:
function setText(elems, text) {
for (let elem of elems) {
elem.textContent = text;
}
}
この関数を実際に試してみましょう。 以下のような段落があるとします:
<p class="elem"></p>
<p class="elem"></p>
<p class="elem"></p>
<p class="elem"></p>
<p class="elem"></p>
この関数を使って、これらのすべての段落に 何らかのテキストを設定しましょう:
let elems = document.querySelectorAll('.elem');
setText(elems, 'text');
関数 appendText を作成してください。
この関数は最初のパラメータとしてDOM要素の配列を受け取り、
2番目のパラメータとしてテキストを受け取るようにします。
この関数が渡された要素の末尾にテキストを追加するようにしてください。
関数 appendElem を作成してください。
この関数は最初のパラメータとして、
タグ ul を含むDOMオブジェクトへの参照を受け取り、
2番目のパラメータとしてテキストを受け取るようにします。
この関数が渡されたテキストを持つ新しい li を作成し、
それを渡された ul タグの末尾に追加するようにしてください。
配列と ul が与えられます。
前のタスクで作成した関数 appendElem を使用して、
配列の各要素をこの ul 内の別々の li に書き込んでください。