HTMLCollectionとは?
HTML
<ul id="parent">
<li id="first">1</li>
<li id="second">2</li>
<li id="third">3</li>
</ul>
JS
const target = document.querySelectorAll('li')[1];
console.log(target);
const parent = target.parentNode;
console.log(parent);
HTMLJavaScript
:
<li id="second">2</li>
<ul id="target">..</ul>
↓
<ul>
<li id="first">1</li>
<li id="second">2</li>
<li id="third">3</li>
</ul>
const base = document.getElementById('parent');
const children = base.children;
console.log(children);
HTMLCollection
JavaScript
HTMLCollection
HTMLCollection(3) [li#first, li#second, li#third, first: li#first, second: li#second, third: li#third]
0: li#first
1: li#second
2: li#third
length: 3
first: li#first
second: li#second
third: li#third
__proto__: HTMLCollection
>
>
`
``HTMLUListElement``` `console.log(parent)`
`parent``HTMLCollection``base.children` 11`HTMLCollection`
`console.log()``HTMLCollection`DOMHTML
xcX3v84RxoQ-4GxG32940ukFUIEgYdPy
144065b1d617895314136e45c42a1ab3