DOM-műveletek callback függvény átadása JavaScripten
Tegyük fel, hogy van egy csoport DOM elemünk:
<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>
Készítsünk egy forEach függvényt, amely
első paraméterként egy elemcsoport szelektort fogad,
második paraméterként pedig egy callback függvényt,
amelyet minden egyes talált elemre sorban alkalmaz:
forEach('.elem', function() {
// a függvény minden elemre alkalmazva lesz
});
Tegyük fel, hogy a szelektor alá eső elemek sorban a callback függvény első paramétereként kerülnek beadásra:
forEach('.elem', function(elem) {
console.log(elem); // sorban kiírja a talált elemeket
});
Használjuk a függvényünket, hogy megtaláljuk az összes
elem osztállyal rendelkező elemet, és minden
talált elemre alkalmazzunk egy callback függvényt, amely
minden egyes elem szövegét négyzetre emeli:
forEach('.elem', function(elem) {
elem.textContent = elem.textContent ** 2;
});
Most írjuk meg a tervezett forEach függvény megvalósítását:
function forEach(selector, func) {
let elems = document.querySelectorAll(selector);
for (let elem of elems) {
func(elem);
}
}
Adottak bekezdések. A létrehozott forEach függvényünk segítségével minden bekezdés szövegének végéhez adjunk hozzá egy felkiáltójelet.