Modifikatorių klavišų sekimas JavaScript

Naudojant Event objektą galima sužinoti, ar įvykio metu buvo nuspausti klavišai Ctrl, Alt ir Shift. Tai daroma su savybių ctrlKey, altKey ir shiftKey pagalba - jos turi reikšmę true arba false priklausomai nuo to, ar buvo nuspaustas tas klavišas įvykio metu, ar ne.

Pažiūrėkime pavyzdį. Tarkime, kad turime šį mygtuką:

<button id="elem">text</button>

Spustelėjus mygtuką, išvesime pranešimą apie tai, ar buvo nuspaustas vienas iš klavišų Ctrl, Alt ir Shift:

let elem = document.querySelector('#elem');

elem.addEventListener('click', function(event) {
	if (event.ctrlKey) {
		console.log('nuspaustas Ctrl');
	}
	
	if (event.altKey) {
		console.log('nuspaustas Alt');
	}
	
	if (event.shiftKey) {
		console.log('nuspaustas Shift');
	}
});

Duotas elementas. Padarykite taip, kad paspaudus jį, jis nusidažytų raudonai, bet tik jei spustelėjimo metu nuspaustas klavišas Alt.

Tarkime, kad turite ul sąrašą su li žymėmis:

<ul id="elem">
	<li>text</li>
	<li>text</li>
	<li>text</li>
	<li>text</li>
	<li>text</li>
</ul>

Padarykite taip, kad spustelint bet kurią li, jos teksto pabaigoje būtų pridėtas skaičius 1, jei nuspaustas klavišas Ctrl, ir skaičius 2, jei nuspaustas klavišas Shift.