Hallo Jürgen
var items = document.getElementById('list').children,
nur ein kleiner unwichtiger Einwand, und auch nur, weil ich mit „Kindknoten“ schon mal Probleme hatte:
Kinder des UL sind nicht nur die LI sondern auch die aus den White Spaces bestehenden Textknoten zwischen </li> und <li>. Die würden in diesem Beispiel auch erfasst.
Nö. Genau deswegen habe ich ja children
verwendet und nicht childNodes
. ;-)
<body>
<ul id="list">
<li>Text <em>Emphasized</em></li>
<li>Text <em>Emphasized</em></li>
</ul>
</body>
Wenn wir hier nun die Eigenschaft childNodes
verwenden, dann sähe das tatsächlich so aus, dass nicht nur die Elementknoten berücksichtigt werden:
const nodes = Array.from(document.getElementById('list').childNodes);
console.log(nodes.every(item => item.nodeType === 1)); // false
Die von der Eigenschaft children
zurückgegebene HTMLCollection enthält im Gegensatz dazu aber tatsächlich nur diejenigen Kindknoten, bei denen es sich um Elemente handelt.
const nodes = Array.from(document.getElementById('list').children);
console.log(nodes.every(item => item.nodeType === 1)); // true
Wenn man also alle Kindelemente haben möchte, ist entsprechend children
zu verwenden.
console.log(nodes); // Array [ <li>, <li> ]
Gruß,
Orlok