Проследяване на модификаторни клавиши в JavaScript

С помощта на обекта Event можем да разберем дали клавишите Ctrl, Alt и Shift са били натиснати в момента на събитието. Това става с помощта на свойствата ctrlKey, altKey и shiftKey - те имат стойност true или false в зависимост от това дали съответният клавиш е бил натиснат в момента на събитието или не.

Нека разгледаме пример. Да предположим, че имаме следния бутон:

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

При кликване върху бутона ще извеждаме съобщение за това дали е бил натиснат някой от клавишите Ctrl, Alt и Shift:

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

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

Даден е елемент. Направете така, че при кликване върху него да се оцветява в червено, но само ако в момента на кликването е натиснат клавишът Alt.

Задание 2

Да предположим, че имате списък ul с елементи li:

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

Направете така, че при кликване върху който и да е li, в края на неговия текст да се добавя числото 1, ако е натиснат клавишът Ctrl, и числото 2, ако е натиснат клавишът Shift.