JavaScript でマウス ポインターがどの要素の上にあるかを判断する 質問する

JavaScript でマウス ポインターがどの要素の上にあるかを判断する 質問する

マウス カーソルがどの要素の上にあるかを示す機能が必要です。

したがって、たとえば、ユーザーのマウスがこのテキストエリア (id を持つwmd-input) の上にある場合、 を呼び出すことはwindow.which_element_is_the_mouse_on()機能的に と同等になります$("#wmd-input")

ベストアンサー1

デモ

document.elementFromPointという、その名の通りの機能を果たす非常に優れた関数があります。

必要なのは、マウスの x 座標と y 座標を見つけて、それらの値を使用して呼び出すことです。

document.addEventListener('mousemove', e => {
  console.clear()
  console.log( document.elementFromPoint(e.clientX, e.clientY) )
}, {passive: true})
[class^='level']{
  width: 100px;
  height: 100px;
  padding: 15px;
  background: #00000033;
}
<div class='level-1'>
  <div class='level-2'>
    <div class='level-3'>
      Hover
    </div>
  </div>
</div>

ドキュメント.elementFromPoint

jQuery イベント オブジェクト

おすすめ記事