document.getElementById()

getElementById について

html

<div id="test" class="a_class b_class">
</div>

javascript

// Element
const testId = document.getElementById('test');

// 結果
console.log(testId);

結果

<div id="test" class="a_class b_class"></div>

説明

HTMLドキュメント内から指定したIDの要素をElementオブジェクトとして取得します。
IDはHTMLドキュメント内でユニークである為 document オブジェクトにて使用出来ます。

クラスの取得

指定したIDの子要素のみ

html

<div id="test">
  <div class="children"></div>
</div>
<div class="children"></div>

javascript

// Element
const testId = document.getElementById('test');

// HTML Collection
const children = testId.getElementsByClassName('children');

// 結果表示
console.log(children);

結果

1つのみ取れてそう。

HTMLCollection [div.children]
0: div.childrenlength: 
1[[Prototype]]: HTMLCollection
© DeNnie.Lab All Rights Reserved.