javascriptを学ぼ。--querySelector()

HTMLの要素を取得する場合に便利なものとしてquerySelectorを使って見ましょう。

よくあるメソッドとして

document.getElementById()

がありますが、これは基本的に、"id"をつけて初めてしていできます。これはこれで使えますが、もっと汎用的に使えるのが

document.querySelector()
Document の querySelector() メソッドは、この引数内(括弧内)で指定されたセレクターまたはセレクターのグループに一致する文書内の一番初めの最初の Element を返します。一致するものが見つからない場合は null を返します。(MDNより)

のようです。さっそくですが使って見ましょう。

<div class="test"> Hellow World </div>
<script>
var test = document.querySelector(".test");
test.innerHTML = "こんにちは";
}
</script>

とすると、画面表示は

こんにちは

と表示されます。

querySelectorではid,class,<p>などのタグなどを指定してやることで取得でき便利ですね。


この記事が気に入ったらサポートをしてみませんか?