目录
(2) offsetWidth 与 dom.style.width 的区别
（3）offsetLeft & offsetTop 是用来计算盒子与盒子之间距离的
(4) offsetLeft 与 dom.style.left 的区别
（6）offsetParent 与 dom.parentNode 的区别
一、
1.dom.style.attr这种方式，只能读/写DOM元素的行内样式，它对于非行内样式（外部的样式表）无能为力。
2.如果想实时的读取盒子的样式，而不管它是行内还是非行内，那么就必须使用offset家族提供的api
（1）offsetWidth & offsetHeight
(2) offsetWidth 与 dom.style.width 的区别
1 offsetWidth既能读取外部样式，也能读取行内样式；而dom.style.width只能读取行内样式
2 offsetWidth读取出来的只是number类型，不带'px'；而width读取出来的值是string类型，带有‘px’
3 offsetWidth是只读的,不能赋值；而dom.style.width可读，可写
offsetWidth = width + padding + border
（3）offsetLeft & offsetTop 是用来计算盒子与盒子之间距离的
(4) offsetLeft 与 dom.style.left 的区别
1 offsetLeft既能读取外部样式，也能读取行内样式；而dom.style.Left只能读取行内样式
2 offsetLeft读取出来的只是number类型，不带'px'；而dom.style.Left读取出来的值是string类型，带有‘px’
3 offsetLeft是只读的,不能赋值；而dom.style.Left可读，可写
4 offsetLeft读取的是目标盒子的左边框 到 自己定位参照物的盒子的左边框的距离，如果没有任何一级的父盒子声明了定位方式，那么offsetLeft读取的就是目标盒子到body左边框的距离
注意：只有offsetLeft，offsetTop，没有offsetRight，offsetBottom
（5）offsetParent 用来获取父级DOM对象
（6）offsetParent 与 dom.parentNode 的区别
1 dom.parentNode永远是直接父元素；dom.offsetParent获取到的父级元素，跟定位有关系
2 如果dom的任何一个父级盒子都没有生命position定位，那么dom.offsetParent获取到的父级对象就是body
3 如果dom的父级盒子有声明了position定位方式，那么dom.offsetParent获取的父级对象就是离它最近的那个声明了position定位的盒子
（7）offset家族就这么多，没有其他的成员了。
二、事件对象
1.何为事件对象？
事件对象是用来帮我们获取，在js事件触发时一系列有用信息的参数对象。
事件对象的名字，一般使用event。当然这不是必须的
2.事件对象的兼容写法
div[i].onclick = function(event){
var evt = event || window.event;
}
3.event对象提供的api
（1）鼠标触发的事件
1 event.target
2 event.srcElement 1和2的功能是相同的，都是过去事件源对象：区别是event.srcElement是IE支持的
3 event.type 获取事件类型
4 event.clientX:获取当前鼠标在网页上的横坐标，只跟网页上可视区域内的坐标有关系
5 event.clientY:获取当前鼠标在网页上的纵坐标，只跟网页上可视区域内的坐标有关系
6 event.screenX:获取当前鼠标在当前显示器上的横坐标
7 event.screenY:获取当前鼠标在当前显示器上的纵坐标
京公网安备 11010502036488号