この記事では、getElementByIdを使ってID名から要素を取得します。
getElementById
使い方
getElementById('ID名')のようにすることで、該当する要素がひとつ取得できます。
<div>
<p id="sample1">サンプル1</p>
<p id="sample2">サンプル2</p>
</div>var sample = document.getElementById('sample1');
console.log(sample);
// => <p id="sample1">
console.log(sample.innerHTML);
// => サンプル1該当するIDがないとnullが返る
該当するIDが複数あるときにはundifineが返ってきます。
var sample3 = document.getElementById('sample3');
console.log(sample3);
// => null該当するIDが複数ある場合には最初の要素が返る
HTMLのID名は一意なので、同じものがない想定ですが、もしID名が複数あった場合には、最初の要素が返ってきます。
<div>
<p id="sample2">サンプル2A</p>
<p id="sample2">サンプル2A</p>
</div>var sample2 = document.getElementById('sample2');
console.log(sample2.innerHTML);
// => サンプル2A