DOM(文本对象模型）

获取元素的css

行内样式：elem.style.样式名

计算好的样式   获取计算好的样式值;样式名用驼峰写法 FontSize
 document.defaultView.getComputedStyle(elem,null).样式名

元素的高与宽

clientWidth/clientHeight    内容+padding（-工具条宽）

offsetWidth/offsetHeight   内容+padding+边框

scrollWidth/scrollHeight    没有滚动条同clientWidth 内容+padding-工具条+滚动的距离

元素与父元素距离

offsetLeft  与相对父元素的左偏移值
offsetTop  与相对父元素的垂直偏移值

offsetParent 相对父元素  (元素的父辈元素有position非static值)

元素的滚动距离

elem.scrollTop
elem.scrollLeft

浏览器滚动距离

document.documentElement.scrollTop
document.body.scrollTop

元素与可视窗口的编辑

elem.getBoundingClientRect()

 图片懒加载

JS事件

绑定

btn.onclick = function(){}

btn.addEventListener(type,funName)

解绑（匿名函数不能解绑）

btn.onclick = null

btn.removeEventListener(type,funName)

事件对象

event.target（事件源对象）

event.offsetX/Y相对于事件源偏移文字

event.pageX/Y    相对于页面偏移位置

      利用event.pageX/Y做鼠标跟随效果

事件传递

冒泡:最具体元素最先捕捉到事件,传递给最不具体的元素（document）

捕获:最不具体的元素先捕获到事件,传递给最具体的元素

默认都是冒泡,使用捕获
elem.addEventlistener(事件类型,响应函数,是否为捕获)
elem.addEventListener("click",doit,true)

阻止事件传递
event.stopPropagation()

阻止默认事件
event.preventDefault()

键盘事件

keypress 按下弹起

keyup  键盘弹起

keydown 键盘按下

event.keyCode 键对应数字编码
event.key键盘的名称
event.which等于keyCode

鼠标事件

mouseover 鼠标移入
mouseout 鼠标移出
mousedown 鼠标按下
mouseup 鼠标弹起
mousemove 鼠标移动
click 单击
dblclick双击

表单事件

change 值发生变化
input 正在输入

focus 获取焦点
blur 失去焦点

页面事件

load加载
resize 窗口变化
scroll滚动