元素和节点

获取元素的大小

 一、获取宽高 （width、height） 

1.offset（自身的宽或者高+padding+border）：没有单位 1.获取元素 2.获取大小

 注意： 1.自身+padding的宽度或者高度+border 2. 没有外边距

2.client : 自身宽高 + padding 没有border没有外边距

二、 获取偏移量offset （top、left）

 1.如果没有定位 会相对于页面来算偏移

2.如果有定位，会相对于父级来计算偏移量

 client (top、left) :获取元素的边框距离

节点类型

一、节点的类型 nodeType属性来查看 ： 1,2,3,8

1. 获取节点里的第一个元素 : 所有元素节点的类型都是1

2.文本节点： 所有的文本节点类型是3

3.注释节点：所有注释节点的类型是8

4.属性节点 ： 元素.attributes 可以获取属性节点的数组

所有的属性节点就是2

二、所有的节点 都会有 nodeName ： 节点名； nodeValue ：节点的值

 1.元素节点  :nodeName 就是标签名（是大写）,nodeValue:是null

2.文本节点 ： nodeName ：“#text”所有的文本节点 ; nodeValue 是具体的内容

3.注释节点： nodeName ：#comment ；nodeValue:注释的内容

4.属性节点 ： nodeName： 属性名 nodeValue：属性值

事件类型

1.type : 事件类型 2.button： 0是鼠标左键 1 滚轮 2 右键

1. 点击位置离浏览器的左边距和上边距 : clientX / clientY;

 这个x、y是相对于浏览器窗口

2.触发事件的距离页面的左边距和上边距： pageX、 pageY

 这个是相对于页面的x和y

3.相对于自身的左边距 和上边距 ： offsetX 、offsetY；

和元素属性有关系 ：宽高 偏移量

            offsetLeft  offsetTop  offsetWidth  offsetHeight

            clientLeft  clientTop  clientWidth  clientHeight

        x、y 都是和鼠标 事件有关系的

            offsetX    offsetY 

            clientX    clientY

            pageX        pageY

ie8以上及Chrome 都可以拿到e这个对象

// ie8及以上浏览器  window.event

// window.event

// console.log(window.event);

varevent=e||window.event;//事件对象的一个兼容