Tracciamento dei tasti modificatori in JavaScript

Tramite l'oggetto Event è possibile sapere se al momento dell'evento erano premuti i tasti Ctrl, Alt e Shift. Questo si fa utilizzando le proprietà ctrlKey, altKey e shiftKey - hanno un valore true o false a seconda che quel tasto fosse premuto al momento dell'evento o meno.

Vediamo un esempio. Supponiamo di avere il seguente pulsante:

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

Al click sul pulsante, visualizzeremo un messaggio che indica se era premuto uno dei tasti Ctrl, Alt e Shift:

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

elem.addEventListener('click', function(event) {
  if (event.ctrlKey) {
    console.log('Ctrl premuto');
  }
  
  if (event.altKey) {
    console.log('Alt premuto');
  }
  
  if (event.shiftKey) {
    console.log('Shift premuto');
  }
});
Задание 1

Dato un elemento. Fai in modo che al click su di esso diventi rosso, ma solo se al momento del click è premuto il tasto Alt.

Задание 2

Supponi di avere una lista ul con tag li:

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

Fai in modo che al click su qualsiasi li, alla fine del suo testo venga aggiunto il numero 1, se è premuto il tasto Ctrl, e il numero 2, se è premuto il tasto Shift.