DOM elemek adatainak lekérése JavaScriptben

A destructuring lehetővé teszi számunkra, hogy szöveget és attribútum értékeket kapjunk a DOM-ból közvetlenül a ciklusban. Nézzük meg, hogyan működik ez. Tegyük fel, hogy a következő bekezdéseink vannak:

<p id="id1">text1</p>
<p id="id2">text2</p>
<p id="id3">text3</p>

Kérjük le ezeknek a bekezdéseknek a gyűjteményét egy változóba:

let elems = document.querySelectorAll('p');

Iteráljunk át az elemeken egy ciklussal, elkülönítve a sorszámokat és magukat az elemeket:

for (let [key, elem] of elems.entries()) {
	console.log(key, elem);
}

Most pedig hajtsuk végre az elemek destructuringját, lekérve belőlük a id értéküket és szövegüket:

for (let [key, {id, textContent}] of elems.entries()){
	console.log(key, id, textContent);
}

Adott a következő kód:

<input id="id1" value="111">
<input id="id2" value="222">
<input id="id3" value="333">

Adja meg a bevitelei mezők sorszámát, id és value értékét.