今回は、「getElementById()」の使い方について。
JavaScriptでは、よく使うメソッドです。
getElementById()とは?
「getElementById()」とは、指定したidを持つ要素を1つ取得するメソッド。
複数のid要素を、一度に複数取得することはできないので注意が必要です。
getElementById()を使ってプログラミングをしよう
「getElementById()」を使って、実際にプログラムを書いて見ましょう。
まずは、HTMLのコードから。
<p id="text"></p>
空のpタグに「text」クラスをつけました。
そして、次はJavaScriptのコードです。
document.getElementById('text').innerHTML = 'おはよう!';
「getElementById()」でHTMLにある「text」クラスの要素を取得。
次に、「.innerHTML」のメソッドを使って、空のpタグに「おはよう!」といった文字を入れるプログラムを書きました。
すると、ブラウザに「おはよう!」と文字が表示されましたね。
これが、「getElementById()」のメソッドの使い方でした。
まとめ
「getElementById()」はJavaScriptのDOM操作をする際によく使うので、是非理解しておきたいところですね。