Toepassing van Map-versamelings

Gestel ons het die volgende paragrawe:

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

Kom ons maak so dat wanneer op elke paragraaf geklik word, die volgorde nommer daarvan aan die einde van die paragraaf geskryf word. Laat ons die probleem oplos met Map.

Kom ons begin. Eerstens, laat ons ons paragrawe in 'n veranderlike kry:

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

Kom ons skep 'n nuwe Map-versameling:

let map = new Map;

Kom ons vul ons versameling so dat die sleutels ons paragrawe is, en hul waardes die volgorde nommers:

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

Kom ons deurloop die paragrawe met 'n lus en koppel 'n klikhanteraar aan hulle:

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

Kom ons voeg nou die volgorde nommer aan die einde van die paragraaf teks toe wanneer daarop geklik word. Ons sal die nommer van ons versameling kry:

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

Gegee invoervelde (inputs). Deurloop hierdie invoervelde met 'n lus en skep 'n Map- versameling waarvan die sleutels die invoervelde is, en die waarde die volgorde nommer op die bladsy. Maak so dat wanneer op enige invoerveld geklik word, sy volgorde nommer in sy value geskryf word.

Gegee invoervelde. In elke invoerveld kan 'n nommer ingevoer word. Laat die invoerveld die ingevoerde nommer onthou wanneer Enter druk word. Maak so dat wanneer die invoerveld fokus verloor, 'n versameling van alle voorheen ingevoerde nommers na die konsole uitvoer.