Map-kollektsioonide rakendamine

Olgu meil lõigud:

<p>aaa</p>
<p>bbb</p>
<p>ccc</p>
<p>ddd</p>
<p>eee</p>

Teeme nii, et iga lõigu klõpsamisel kirjutatakse selle lõppu selle järjekorranumber lõikude loendis. Lahendame ülesande läbi Map.

Asugem tööle. Kõigepealt hankige meie lõigud muutujasse:

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

Loome uue kollektsiooni Map:

let map = new Map;

Täidame meie kollektsiooni nii, et võtmeteks oleks meie lõigud ja nende väärtusteks - järjekorra numbrid:

let i = 1;
for (let elem of elems) {
	map.set(elem, i++);
}

Vaatleme lõigud tsüklil ja lisame neile klõpsuhalduri:

for (let elem of elems) {
	elem.addEventListener('click', function() {
		
	});
}

Klõpsamisel lisame järjekorranumbri lõigu teksti lõppu. Samas saame selle numbri meie kollektsioonist:

for (let elem of elems) {
	elem.addEventListener('click', function() {
		this.textContent += map.get(this);
	});
}

Antud on sisendväljad. Vaatlege need sisendväljad tsüklil ja looge kollektsioon Map, mille võtmeteks on sisendväljad ja väärtuseks - nende järjekorranumber lehel. Tehke nii, et mis tahes sisendväljale klõpsates kirjutatakse selle value-sse selle järjekorranumber.

Antud on sisendväljad. Igal sisendväljal saab sisestada numbri. Klahvi Enter vajutamisel jätab sisendväli sisestatud numbri meelde. Tehke nii, et kui sisendväli kaotab fookuse, kuvatakse konsooli kõikide varem sisendväljale sisestatud numbrite massiiv.