DOM要素の関数パラメータとしての渡し方

これまでのレッスンでは、関数に要素のセレクタを渡し、関数内でそれらの要素への参照を取得していました。別のアプローチもあります:関数には、事前に取得済みの要素への参照を渡すことができます。

例を見てみましょう。以下のようなコードがあるとします:

html<p id="elem1"></p>
<p id="elem2"></p>

setTextという関数を作りましょう。この関数は、第一パラメータとしてDOM要素への参照を、第二パラメータとして要素のテキストを受け取ります:

javascriptfunction setText(elem, text){
  elem.textContent = text;
}

作成した関数を使って、段落のテキストを設定しましょう:

javascriptlet elem1 = document.getElementById('elem1');
setText(elem1, 'text1');

let elem2 = document.getElementById('elem2');
setText(elem2, 'text2');
Задание 1

appendText関数を作成してください。この関数は、第一パラメータとしてDOM要素を、第二パラメータとしてテキストを受け取ります。この関数が、その要素の末尾にテキストを追加するようにしてください。

Задание 2

いくつかの段落が与えられています。これらを取得し、ループで処理して、前のタスクで作成した関数appendTextを使って、それぞれの末尾に'!'を追加してください。

Задание 3

setValue関数を作成してください。この関数は、第一パラメータとして入力フィールド(input)への参照を、第二パラメータとしてテキストを受け取ります。この関数が、渡されたテキストを入力フィールドのvalueに設定するようにしてください。