JavaScript: getElementById() id属性値で要素を取得する
id属性値で要素を取得する場合は、document オブジェクトの getElementById() メソッドを使用します。
分解すると get、Element、By、Id の4つに分解できます。 最初の get は全て小文字ですが、他は先頭が大文字です。
1つのHTMLドキュメントの中にid属性は1つですから、「Element」と単数形になっています。
getElementsByTagName()や、getElementsByClassName()は「Elements」です。 最初のうちは間違えやすいので注意してください。
書式
document.getElementById('id属性値')
サンプルコード
div 要素(id="start")の内容を取得するプログラムです。
<div id="start">Start Game</div>
<script>
// 要素を取得
var d = document.getElementById('start');
// 要素内容
console.log(d.innerHTML);
</script>
「document.getElementById('start')」で要素を取得して、 d.innerHTML で要素内容を取得しています。
要素内容を変更する場合は次のように記述します。
d.innerHTML = '新しいコンテンツ';