什么是事件
事件就是用来触发函数的一个开关
<select id="chose1" onchange="change(selectedIndex)"></select>
<script>
function change(obj) {
}
</script>
事件总结
事件的绑定
在行内绑定
<select id="chose1" onchange="change(selectedIndex)"></select>
<script>
function change(obj) {
"执行的代码块"
}
</script>
在js中进行绑定
window.onload = function() {
"执行的代码块"
}
在js中绑定
bunz[0].addEventListener("click", "代码块");
事件流
js中的事件流有两个过程一个是冒泡阶段,一个是捕获阶段
事件冒泡:
事件开始时由最具体的元素(文档中嵌套层次最深的那个节点)接收,然后逐级向上传递到较为不具体的节点。
事件捕获:
事件捕获的思想时不太具体的节点应该更早接收到事件,而最具体的节点应该最后接收到事件。事件捕获的意义在于在在事件到达预定目标之前捕获它。
dom事件流
一、DOM事件模型:包括捕获和冒泡(ie用的是事件冒泡),捕获是从上往下到达目标元素,冒泡是从当前元素,也就是目标元素往上到window。是两个过程。
传统方式的事件模型即直接在DOM元素上绑定事件处理器
Firefox等浏览器很坚决的遵循W3C标准来制定浏览器事件模型
IE自己的事件模型跟W3C的类似,但主要是通过attachEvent和detachEvent两个函数来实现的。
二.三个阶段
在DOM兼容浏览器中,事件流分为3个阶段:
(1)捕获阶段:事件从Document节点自上而下向目标节点传播的阶段;
(2)目标阶段:真正的目标节点正在处理事件的阶段;
(3)冒泡阶段:事件从目标节点自下而上向Document节点传播的阶段。
1.独特性质
DOM事件流最独特的性质是,文本节点也触发事件(在IE中不会),当鼠标单击“单击此文本”文本时会触发click事件,该事件的捕获阶段最先开始,从Document节点开始逐渐向下传播,直到“单击此文本”文本节点,事件进入目标阶段,在目标阶段结束之后,事件由“单击此文本”文本节点开始事件的冒泡阶段,直到Document节点为止。
另外,需要说明的是,有些事件是可以取消的,在整个事件流的任何位置通过调用事件的stopPropagation方法可以停止事件的传播过程。
三.两种方法
1.冒泡事件流
当事件在某一DOM元素被触发时,例如用户在客户名字节点上点击鼠标,事件将跟随着该节点继承自的各个父节点冒泡穿过整个的DOM节点层次,直到它遇到依附有该事件类型处理器的节点,此时,该事件是onclick事件。在冒泡过程中的任何时候都可以终止事件的冒泡,在遵从W3C标准的浏览器里可以通过调用事件对象上的stopPropagation()方法,在Internet Explorer里可以通过设置事件对象的cancelBubble属性为true。如果不停止事件的传播,事件将一直通过DOM冒泡直至到达文档根。
如果想创建一个捕捉事件,在支持W3C 事件模型的浏览器中,将addEventListener的第三个参数设为true就好了。
2.捕获事件流
事件的处理将从DOM层次的根开始,而不是从触发事件的目标元素开始,事件被从目标元素的所有祖先元素依次往下传递。在这个过程中,事件会被从文档根到事件目标元素之间各个继承派生的元素所捕获,如果事件监听器在被注册时设置了useCapture属性为true,那么它们可以被分派给这期间的任何元素以对事件做出处理;否则,事件会被接着传递给派生元素路径上的下一元素,直至目标元素。事件到达目标元素后,它会接着通过DOM节点再进行冒泡。
dom的分级
一.Dom的分级
1.DOM1 级(DOM Level 1)
DOM1 级由两个模块组成:DOM核心(DOM Core)和DOM HTML。
DOM 核心规定的是如何映射基于XML 的文档结构,以便简化对文档中任意部分的访问和操作。
DOM HTML 模块则在DOM 核心的基础上加以扩展,添加了针对HTML 的对象和方法。
2.DOM2 级(DOM Level 2)
在DOM1的基础上扩充了:
(1)、鼠标和用户界面事件、范围、遍历等细分模块
(2)、通过对象接口增加了对CSS(Cascading Style Sheets,层叠样式表)的支持
(3)、DOM核心模块也经过扩展开始支持XML 命名空间
3.DOM3 级(DOM Level 3)
(1)、以统一方式加载和保存文档的方法——在DOM 加载和保存(DOM Load and Save)模块中定义
(2)、验证文档的方法——在DOM 验证(DOM Validation)模块中定义
(3)、开始支持XML 1.0 规范