27 js三大家族

为什么:获取元素的位置


client：可视区域的宽度
	clientTop：盒子的上boder
	clientLeft：盒子的左border
	clientWidth = width +左右 padding
	clientHeight = height + 上下padding

offset
	offsetWidth 左右border+左右padding+width
	offsetHeight 上下border+上下padding+height
	offsetLeft   距离有定位的父元素的距离
	offsetTop   距离有定位的父元素的距离
	op.offsetParent  有定位的父元素


scroll
	scrollWidth 左padding+内容真实的宽度
	scrollHeight 上padding+内容真实的高度
	scrollLeft 卷出去的距离
	scrollTop  卷出去的距离

e.offsetX/e.clientX/e.pageX/e.screenX的区别

	e.offsetX：鼠标相对于事件源的X方向的距离
	e.clientX：距离浏览器可视区域X方向的距离
	e.pageX：鼠标相对于文档X方向的距离
	e.screenX：鼠标距离屏幕X方向的距离
	不可变的，只能获取不能设置的