预解析:
引用:
严格模式:
'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规定
