clientY выдает underfined

Почему в коде ниже clientY равен undefined?

window.addEventListener('scroll', e => {
  console.log(document.querySelector('section').clientY);
});
<div>qw</div>
<div>qwq</div>
<div>wq</div>
<div>ad</div>
<div>qw</div>
<div>qwq</div>
<div>wq</div>
<div>ad</div>
<div>qw</div>
<div>qwq</div>
<div>wq</div>
<div>ad</div>
<div>qw</div>
<div>qwq</div>
<div>wq</div>
<div>ad</div>
<div>qw</div>
<div>qwq</div>
<div>wq</div>
<div>ad</div>
<div>qw</div>
<div>qwq</div>
<div>wq</div>
<div>ad</div>
<section>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Voluptatibus temporibus eius mollitia cupiditate earum ex eaque ut laudantium magni tempore vel, nulla libero, animi tenetur accusamus consequuntur obcaecati ipsa quibusdam?Lorem ipsum, dolor sit
  amet consectetur adipisicing elit. Provident, facilis fuga at voluptatibus laudantium magni! Id aspernatur quaerat consequatur. Eligendi officiis voluptas, voluptates consequatur accusamus cum distinctio? At, doloribus ipsa!</section>


Ответы (1 шт):

Автор решения: azlov

Потому что clientY это свойство событий интерфейса MouseEvent, таких как: click, dblclick, mouseup, mousedown. Со scroll вы работаете по-другому:

document.addEventListener('scroll', e => {
  console.log(window.scrollY);
});
<div>qw</div>
<div>qwq</div>
<div>wq</div>
<div>ad</div>
<div>qw</div>
<div>qwq</div>
<div>wq</div>
<div>ad</div>
<div>qw</div>
<div>qwq</div>
<div>wq</div>
<div>ad</div>
<div>qw</div>
<div>qwq</div>
<div>wq</div>
<div>ad</div>
<div>qw</div>
<div>qwq</div>
<div>wq</div>
<div>ad</div>
<div>qw</div>
<div>qwq</div>
<div>wq</div>
<div>ad</div>
<section>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Voluptatibus temporibus eius mollitia cupiditate earum ex eaque ut laudantium magni tempore vel, nulla libero, animi tenetur accusamus consequuntur obcaecati ipsa quibusdam?Lorem ipsum, dolor sit
  amet consectetur adipisicing elit. Provident, facilis fuga at voluptatibus laudantium magni! Id aspernatur quaerat consequatur. Eligendi officiis voluptas, voluptates consequatur accusamus cum distinctio? At, doloribus ipsa!</section>

→ Ссылка