Dublikatsiz DOM elementlerini almak
Bizde abzaslar we düwme bar diýeliň:
<p>aaa</p>
<p>bbb</p>
<p>ccc</p>
<p>ddd</p>
<p>eee</p>
<button>click me</button>
Ulanyjy bu abzaslara islendik tertipde basýar diýeliň.
Bir düwmä basylanyňda, basylan her abzasyň soňuna
çykyş belgisini goşýan bir funksiýa ýasalyň. Mesele
Set arkaly çözeliň.
Başlalyň. Ilki bilen elementlerimizi üýtgeýjilere alýarys:
let button = document.querySelector('button');
let elems = document.querySelectorAll('p');
Täze bir Set ýygnamasyny dörediň:
let set = new Set;
Abzaslary aýlaw bilen gezip, olara basylma hereketiniň işleýjisini baglaň:
for (let elem of elems) {
elem.addEventListener('click', function() {
});
}
Indi bir abzasa basylanyňda, şol abzasy ýygnamanyň içine goşalyň:
for (let elem of elems) {
elem.addEventListener('click', function() {
set.add(this);
});
}
Set ýygnamasyny ulanandygymyz üçin,
bir abzasa gaýtadan basylmagy, şol abzasyň dublikatynyň goşulmagyna getirmez.
Indi düwämä basylanyňda, ýygnamanyň mazmunyny gezip, her abzasyň soňuna çykyş belgisini goşalyň:
button.addEventListener('click', function() {
for (let elem of set) {
elem.textContent = elem.textContent + '!';
}
});
Abzaslar we düwme berlen. Ulanyjy bu abzaslara islendik tertipde basýar. Bir düwmä basylanyňda, basylan her abzasyň soňuna çykyş belgisini goşýan funksiýany ýazyň.
