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

liタグを持つulリストがあるとします：

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

どのliをクリックしても、 Ctrlキーが押されていた場合はそのテキストの末尾に数字1を追加し、 Shiftキーが押されていた場合は数字2を追加するようにしてください。