Att skicka en callback för att arbeta med DOM i JavaScript

Låt oss säga att vi har en grupp DOM-element:

<p class="elem">1</p>
<p class="elem">2</p>
<p class="elem">3</p>
<p class="elem">4</p>
<p class="elem">5</p>

Låt oss skapa en funktion forEach som tar en selektor för en grupp element som första parameter, och en callback-funktion som andra parameter, som appliceras i tur och ordning på varje av de hittade elementen:

forEach('.elem', function() {
	// funktionen kommer att appliceras på varje element
});

Låt elementen som matchar selektorn, hamna i den första parametern för callback i tur och ordning:

forEach('.elem', function(elem) {
	console.log(elem); // kommer att skriva ut de hittade elementen i tur och ordning
});

Låt oss använda vår funktion för att hitta alla element med klassen elem och för varje hittat element applicera en callback, som kvadrerar texten i varje element:

forEach('.elem', function(elem) {
	elem.textContent = elem.textContent ** 2;
});

Låt oss nu skriva implementationen av vår tänkta funktion forEach:

function forEach(selector, func) {
	let elems = document.querySelectorAll(selector);
	
	for (let elem of elems) {
		func(elem);
	}
}

Det finns stycken. Med hjälp av vår skapade funktion forEach, lägg till ett utropstecken i slutet av varje styckes text.