预解析

预解析:

引用:

严格模式:
    'use strict'
    1.不加var声明变量
    2.函数中this指向window的bug 
    3.with
    4.if   for  while   switch....定义函数
try  catch
    
onfocus  获取焦点事件
onblur   失去焦点事件
DOM
    尽量少用DOM操作
    document.createElement('标签')
    父级.appendChild(obj) 最后一个子级
    父级.insertBefore(要插入,插入谁之前)
    父级.removeChild(obj)
    obj.cloneNode(true)  id='';
    parentNode
    children
    childNodes   3     1
    previousElementSibling
    nextElmentSibling
    firstElementChild
    lastElementChild
    tagName
    nodeType
    children[]
    offsetWidth
    offsetHeight
    offsetLeft
    offsetTop
onscroll  滚轮事件
    document.documentElement.scrollTop||document.body.scrollTop;
    document.documentElement.scrollLeft||document.body.scrollLeft;
onresize  改变窗口大小
    document.documentElement.clientHeight;
    document.documentElement.clientWidth;
BOM
    window.open('','')
    .......
    var b=confirm('你要删除吗')

获取元素
结构：parentNode document 结构父级
定位：offsetParent body 定位父级
**offsetLeft 物体到有定位父级的一个左边距离
obj.getBoundingClientRect(); 获取绝对位置;
.left 左边距离页面左边的距离
.top 上边距离页面上边的距离
.right 右边距离页面左边的距离
.bottom 下边距离页面上边的距离
操作属性
正常和自定义的都行
获取自定义属性
obj.getAttribute('属性名');
设置自定义属性
obj.setAttribute('属性名','属性值');
删除自定义属性
obj.removeAttribute(名)
成对出现 不能和自定义属性混用
图片延迟加载（懒加载）
你看的东西加载，不看的不加载。
节约资源，带宽，流量。 用户体验.钱
物体高度：
obj.offsetHeight 物体盒子模型高度
obj.scrollHeight 内容高度
如果内容小于offsetHeight,取得offsetHeight
如果内容大于offsetHeight,内容高度
瀑布流
每块的高度不同
最后每列的高度都差不多。
每次往高度最小的里面加东西。

innerHTML的问题:
innerHTML加等于的话:会清空之前身上事件
图片对象:
new Fuction()
new Oject()
new Image() 创建一个图片对象
这个东西跟在html中手写的img标签一模一样。
img.onload 当图片加载成功触发这个事件。
img.onerror 当图片加载失败触发这个事件。
图片预加载:
提前悄悄的加载
目的：用户体验稍微好一些
现在 用的越来越少
文字提示:
事件
获取焦点事件
onfocus
失去焦点事件
onblur
获取焦点函数
让一个文本框上来就获取焦点
.focus() 让一个元素获取焦点
.blur() 让一个元素失去焦点

事件对象(event) 包含了事件的详细信息。
ev参数 事件对象 兼容chrome FF IE8 9 10 但是得传参
event 事件对象 兼容Chrome和IE系列
var oEvent = ev||event;(他们俩个不能换位置)
平时注意写上window.onload
只能获取到鼠标和键盘的操作。
获取鼠标在可视区中的坐标:
事件对象.clientX; 获取可视区中X轴坐标
事件对象.clientY; 获取可视区中Y轴坐标
**以后只要是操作clientX和clientY就加上滚动距离。
ondblclick 双击事件。
onmousemove 鼠标移动事件
注意：移动事件触发的特别频繁。所以里面别放复杂代码。

div跟随鼠标移动:
****出现滚动的时候加上滚动距离
var scrollTop=document.documentElement.scrollTop||document.body.scrollTop;
事件冒泡:
子级会去找父级相同的事件执行
就算当前元素没什么没有这个事件 也会往上冒
冒泡跟结构有关 (没事不要取消)
取消事件冒泡:
var oEvent=ev||event;
oEvent.cancelBubble=true 取消事件冒泡. IE chrome照顾IE
oEvent.stopPropagation(); 取消事件冒泡. W3C规定