Является ли цель MouseEvent всегда элементом? - PullRequest
Новая
       0

Является ли цель MouseEvent всегда элементом?

3 голосов
/ 21 февраля 2020

Код Visual Studio показывает, что целевая переменная имеет тип EventTarget в следующем коде TypeScript: 

document.addEventListener('click', (event) => {
  let target = event.target
})

Почему она не помечена скорее как Элемент ? Может ли CharacterData или Document быть также целью MouseEvent? Я щелкал в окне веб-браузера со следующим кодом HTML, но мне не удалось получить типы EventTarget, кроме Element. 

<!DOCTYPE html>
<html>
<head>
 <title>Test</title>
 <script>
   document.addEventListener('click', (event) => {  
     let target = event.target
     console.log(target instanceof Element)
   })
 </script>
</head>
<body>
test
</body>
</html>

Если код Visual Studio помечает цель MouseEvent как элемент, то Я мог бы написать в Typescript: 

document.addEventListener('click', (event) => {
  if (event.target.matches('.carousel__control--prev'))
    shiftCarouselLeft(event.target.closest('.carousel'))
})

Но теперь я должен явно привести event.target к Element для вызова функции match (): 

document.addEventListener('click', (event) => {
  let target = <Element>event.target
  if (target.matches('.carousel__control--prev'))
    shiftCarouselLeft(target.closest('.carousel'))
})

Ответы [ 2 ]

2 голосов
/ 21 февраля 2020

Можно получить событие мыши для всего узла Document, но не для всех событий. Вы можете получить узел Document, например, mouseenter и mouseleave, например , он показан в демоверсии (работает в Chrome, но не работает в Firefox или Safari).

Теоретически также возможно получить такое событие на текстовом узле, но AFAIK нет в браузерах.

1 голос
/ 21 февраля 2020

Любой EventTarget может быть целью события MouseEvent: 

const foo = new EventTarget();
foo.addEventListener('click', (evt) => {
  console.log('is `foo`', evt.target === foo);
  console.log('is MouseEvent',  evt instanceof MouseEvent);
});
foo.dispatchEvent( new MouseEvent('click') );
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...