Day12 默认行为和事件冒泡

浏览器的默认行为以及阻止浏览器的默认行为（兼容）

javascript中的默认行为是指javascript中事件本身具有的属性，如标签可以跳转，文本框可输入文字、字母、图片路径等，右键浏览器会出现菜单等行为便被称为浏览器的默认行为。

return false; 退出执行, 所有触发事件和动作都不会被执行.
可以用来替代 preventDefault()（取消默认事件）
ev.preventDefault(); 标准浏览器阻止默认事件,DOM事件使用此方法取消默认事件。
ev.returnValue = false;

非标准浏览器（IE8）阻止默认事件

事件监听器（事件绑定）

target.addEventListener("click", fun, false); --标准浏览器
target.attachEvent("onclick",fun); --IE浏览器（执行顺序按照绑定的反序）
removeEventListener()/detachEvent() 移除事件绑定的参数和添加事件绑定是一致的。注意匿名函数的问题。

可以绑定多个函数在一个对象上。
执行顺序按照绑定的顺序来（IE反向）。
第三个参数是否使用捕捉(反向冒泡)，默认false，为冒泡。
标准浏览器和非标准浏览器事件绑定的区别。
DOM 0级和 DOM 2级的区别：
0级
- onclick/onmousedown 普通事件
- DOM 0级事件取消：将结果设为空 (null)
- 一个对象上面只能绑定同一个事件(事件处理函数)
2级
- 一个元素对象上面可以绑定多个事件处理函数。
- 标准浏览器：addEventListener('事件类型',函数,是否捕获);
- 1.事件类型：click,mouseover,mousedown,keyup
- 2.处理的函数
- 3.是否捕获:true:捕获 false:冒泡
区别：
- 普通事件绑定一个事件，事件绑定多个事件
- 普通事件取消赋值为null,事件绑定removeEventListener,detachEvent
- 注意事件类型。事件绑定不带on

事件捕获

“DOM2级事件”规定的事件流包括三个阶段：事件捕获阶段、处于目标阶段和事件冒泡阶段。

Netscape团队提出的另一种事件流叫做事件捕获,即事件开始时由最不具体的节点应该早接收到事件，而最具体的节点应该最后接收到事件。

事件委托机制

利用冒泡机制，将子元素事件委托给父元素执行。


             

            
            
                aaaaaaaaaaaaaaaa
                pppppppppppppppppp
                bbbbbbbbbbbbbbbb
                pppppppppppppppppp
                cccccccccccccccc

拖拽效果（onmousedown/onmousemove/onmouseup）

拖拽的过程中，短线的位置是不变的，鼠标的位置是随着move时候发生变化，通过可变的move 和不可变的短线求盒子的位置

应用

1．鼠标拖拽轨迹

2．弹出窗口拖拽（百度的登录框）

3．扩展案例：拖拽轨迹回放

综合应用

1．九宫格拖拽交换位置