Het ophalen van DOM element gegevens in JavaScript
Destructuring stelt ons in staat om tekst en attribuutwaarden van DOM direct in de loop te verkrijgen. Laten we eens begrijpen hoe dit werkt. Stel dat we de volgende alinea's hebben:
<p id="id1">text1</p>
<p id="id2">text2</p>
<p id="id3">text3</p>
Laten we de collectie van deze alinea's in een variabele zetten:
let elems = document.querySelectorAll('p');
Laten we de elementen herhalen met een loop, waarbij we de sleutels en de elementen zelf scheiden:
for (let [key, elem] of elems.entries()) {
console.log(key, elem);
}
Laten we nu destructuring toepassen op de
elementen, waarbij we hun id en
teksten eruit halen:
for (let [key, {id, textContent}] of elems.entries()){
console.log(key, id, textContent);
}
Gegeven de volgende code:
<input id="id1" value="111">
<input id="id2" value="222">
<input id="id3" value="333">
Haal de sleutels, id en value van de inputs op.