こんにちは、kazuです。
本日はgetElementByIdについて解説していきます。
getElementByIdとは
javascriptを触るとたびたび出てきます。
ですので覚えていて損はないです。
getElementByIdとはhtmlタグで指定したID値の要素を返すメソッドです。
記入例
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset = "UTF-8">
<title>イベント</title>
</head>
<body>
<p id="msg"></p>
<script>
document.getElementById("msg").innerHTML = "hello would";
</script>
</body>
</html>
実行結果
このように
document.getElementById("msg").innerHTML = "hello would";で取得した”hello would”をhtmlのid”msg”を通してを実行しています。
getElementByIdのデータ見てみよう
<!DOCTYPE html>
<html lang = "ja">
<head>
<meta charset = "UTF-8">
<title>イベント</title>
</head>
<body>
<p id = "msg">hello would</P>
<script>
var msgid = "msg";
console.log(document.getElementById(msgid));
</script>
</body>
</html>今回はpタグのid”msg”をconsole.logで見てみましょう。
結果は上記のようになります。
8行目すべて表示されていますね。
idすべてを取得しています。
最後に
いかがでいしたでしょうか？
今回のgetElementByIdはよく見かけることになります。
少しは理解できましたでしょうか。
最後までご覧いただきありがとうございました。