DOM էլեմենտների ստացում կրկնօրինակներ չունեցող
Ենթադրենք ունենք պարբերություններ և կոճակ.
<p>aaa</p>
<p>bbb</p>
<p>ccc</p>
<p>ddd</p>
<p>eee</p>
<button>click me</button>
Ենթադրենք օգտատերը կտտացնում է այս պարբերություններին
կամայական հերթականությամբ: Եկեք անենք այնպես,
որ կոճակը սեղմելիս յուրաքանչյուր պարբերության վերջում,
որի վրա կատարվել է կտտոց, ավելացվի
բացականչական նշան: Լուծենք խնդիրը
Set-ի միջոցով:
Սկսենք: Նախ ստացնենք մեր էլեմենտները փոփոխականների մեջ.
let button = document.querySelector('button');
let elems = document.querySelectorAll('p');
Ստեղծենք նոր Set կոլեկցիա.
let set = new Set;
Ցիկլով անցնենք պարբերություններով և կախենք դրանց վրա կտտոցի մշակիչ.
for (let elem of elems) {
elem.addEventListener('click', function() {
});
}
Եկեք այժմ պարբերության վրա կտտացնելիս ավելացնենք այդ պարբերությունը կոլեկցիայի մեջ.
for (let elem of elems) {
elem.addEventListener('click', function() {
set.add(this);
});
}
Քանի որ մենք օգտագործում ենք Set կոլեկցիա,
պարբերության վրա կրկնակի կտտոցը չի հանգեցնի
պարբերության կրկնօրինակի ավելացման:
Եկեք այժմ կոճակի վրա կտտացնելիս անցնենք մեր կոլեկցիայի պարունակության վրայով և յուրաքանչյուր պարբերության վերջում ավելացնենք բացականչական նշան.
button.addEventListener('click', function() {
for (let elem of set) {
elem.textContent = elem.textContent + '!';
}
});
Տրված են պարբերություններ և կոճակ: Օգտատերը կտտացնում է այս պարբերություններին կամայական հերթականությամբ: Անեք այնպես, որ կոճակը սեղմելիս յուրաքանչյուր պարբերության վերջում, որի վրա կատարվել է կտտոց, ավելացվի բացականչական նշան:
