JS鼠标、节点位置

从节点中能获取到的:

获取节点：document.getElementById(‘box’);

clientHeight/clientWidth: 不包括滚动条,不包括border；（有用）

clientLeft/clientTop：只有border

offsetWidth/offsetHeight: 包括border和padding；（有用）

offsetLeft/offsetTop：离整个页面文档的距离

scrollHeight/scrollWidth: 包含滚动条,不包括border；（有用）

scrollLeft/scrollTop：没有滚动条就为0

从事件对象获取到的：(鼠标位置)

vue中同时传参数和事件对象，第一个参数写$event

clientX/clientY：鼠标离文档距离

offsetX/offsetY：鼠标离所在盒子距离

screenX/screenY：鼠标离整个屏幕距离

• mouseover：不论鼠标指针穿过被选元素或其子元素，对应mouseout

• mouseenter ：只有在鼠标指针穿过被选元素时，对应mouseleave

  都是移入的时候触发一次

放大镜特效计算鼠标位置：

鼠标位置：e.clientX-节点.offsetLeft