В javascript, возможно ли для меня вернуть элемент любого элемента DOM, над которым я зависаю?

#javascript #html #hover #event-listener

#javascript #HTML #наведите курсор #прослушиватель событий

Вопрос:

Например, если у меня есть фрагмент HTML, подобный этому:

 <body>
    <div id="1">
        <span class="title">I'm a title!</span>
    </div>
    <div id="2">I'm the first element!</div>
    <div id="3">I'm the first element!</div>
<body>
 

Очевидно, что если бы я хотел получить определенный элемент, скажем, div с идентификатором 1, я мог бы сделать что-то вроде

 document.getElementById("1").addEventListener("mouseover", () => console.log("in div 1!"), false);
 

и это выводилось in div 1! бы всякий раз, когда я зависал над ним. Но есть ли какой-нибудь javascript, который я могу применить к каждому отдельному элементу body ? Чтобы в основном написать какую-то функцию, например, getElementUserIsHoveringOver() ?

Я не думаю addEventListener , что это работает HTMLCollections , что было моей единственной идеей.

Ответ №1:

mouseover пузырьки, поэтому, если вы присоедините прослушиватель к <body> , вы можете отслеживать события и регистрировать event.target :

 document.body.addEventListener('mouseover', (e) => {
  console.log(e.target);
}); 
 <div id="1">
    <span class="title">I'm a title!</span>
</div>
<div id="2">I'm the first element!</div>
<div id="3">I'm the second element!</div> 

Комментарии:

1. Это именно то, что я хотел узнать! Большое вам спасибо!