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

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

html<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:

javascriptforEach('.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:

javascriptforEach('.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:

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

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

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