Методы прослушивания событий JavaScript для получения идентификатора нажатых элементов

Чтобы получить идентификатор элемента, по которому щелкнули мышью, с помощью прослушивателей событий JavaScript, вы можете использовать несколько методов. Вот несколько распространенных подходов:

Метод 1: встроенный обработчик событий

<button id="myButton" onclick="handleClick(this.id)">Click me</button>
<script>
  function handleClick(clickedId) {
    console.log(clickedId);
    // Perform further actions with the clickedId
  }
</script>

Метод 2: прослушиватель событий

<button id="myButton">Click me</button>
<script>
  document.getElementById("myButton").addEventListener("click", function(event) {
    console.log(event.target.id);
    // Perform further actions with event.target.id
  });
</script>

Метод 3. Делегирование событий (для нескольких элементов)

<ul id="myList">
  <li id="item1">Item 1</li>
  <li id="item2">Item 2</li>
  <li id="item3">Item 3</li>
</ul>
<script>
  document.getElementById("myList").addEventListener("click", function(event) {
    if (event.target && event.target.nodeName === "LI") {
      console.log(event.target.id);
      // Perform further actions with event.target.id
    }
  });
</script>

В приведенных выше примерах при нажатии кнопки или элемента списка соответствующий идентификатор записывается в консоль. Вы можете изменить эти методы в соответствии со своими требованиями.