Klahvimodifikaatorite jälgimine JavaScriptis

Objekti Event abil saame teada, kas sündmuse toimumise hetkel olid vajutatud klahvid Ctrl, Alt ja Shift. Seda tehakse omaduste ctrlKey, altKey ja shiftKey abil - nende väärtus on true või false sõltuvalt sellest, kas see klahv sündmuse toimumise hetkel vajutatud oli või mitte.

Vaatame näidet. Olgu meil antud järgmine nupp:

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

Nupule klõpsates kuvame teate selle kohta, kas üks klahvidest Ctrl, Alt ja Shift oli vajutatud:

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

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

Antud element. Tehke nii, et sellele klõpsates see värvitakse punaseks, kuid ainult siis, kui klõpsamise hetkel on klahv Alt all.

Olgu teil loend ul siltidega li:

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

Tehke nii, et mis tahes li-le klõpsates lisatakse selle teksti lõppu number 1, kui klahv Ctrl on all, ja number 2, kui klahv Shift on all.