5.19 -20总结

1  offsetHeight和style.height的区别

style.height是字符串，offsetHeight是数值

 demo.style.height是用来获取和设置行内样式的，offsetHeight是只读属性

  demo.style.height只能获取和设置行内样式，如果样式写到了其他地方，甚至根本就没写，便无法获取

  因此，工作中一般用demo.offsetHeight来获取某元素的真实宽度/高度，用style.height来设置宽度/高度

   1.2 offsetHeight的构成

      offsetHeight = height+padding+border （包括自身高度内边距边框不包括外边距）

2   offsetLeft和offsetTop

    用来得到对象的位置（注意：没有offsetRight和offsetBottom）

  @offsetLeft的构成

        到最近的（带有定位的）父元素的左侧/顶部的距离

         如果所有父级都没有定位则以body为准

         offsetLeft是自身border左侧到父级padding左侧的距离

 @offsetLeft和style.left的区别

   一、style.left只能获取行内样式

   二、offsetLeft只读，style.left可读可写

  三、offsetLeft是数值，style.left是字符串并且有单位px

  四、如果没有加定位，style.left获取的数值可能是无效的

  五、最大区别在于offsetLeft以border左上角为基准，style.left以margin左上角为基准

3  ie和dom事件流的区别

1.事件流的区别

IE采用冒泡型事件 Netscape使用捕获型事件 DOM使用先捕获后冒泡型事件

示例：

冒泡型事件模型： button->div->body (IE事件流)

捕获型事件模型： body->div->button (Netscape事件流)

DOM事件模型： body->div->button->button->div->body (先捕获后冒泡)

2.事件侦听函数的区别

IE使用:

[Object].attachEvent("name_of_event_handler", fnHandler); //绑定函数

[Object].detachEvent("name_of_event_handler", fnHandler); //移除绑定

DOM使用：

[Object].addEventListener("name_of_event", fnHandler, bCapture); //绑定函数

[Object].removeEventListener("name_of_event", fnHandler, bCapture); //移除绑定

bCapture参数用于设置事件绑定的阶段，true为捕获阶段，false为冒泡阶段。