一、事件与事件处理概述
事件处理过程:
a.发生事件;
b.启动事件处理程序;
c.事件处理程序作出反应。
=================================
在使用事件处理程序对页面进行操作时,最主要的是如何通过对象的事件来指定事件处理程序。有一下两者方式:
1.在JavaScript中:(在下面两段代码中,一定要将<input/>放在<script/>代码上方,否则会弹出‘b_save为空或不是对象’的错误提示),还有一点就是,在测试过程中,我发现用id属性的值和name属性的值都是可以的。。
<input id="save" name="bt_save" type="button" value="保存"/>
<script type="text/javascript">
var b_save = document.getElementById("save");
b_save.onclick = function(){
alert("单击了保存按钮");
}
</script>
或
<form id="f_form1" name="form1" method="post" action="">
<input id="save" name="bt_save" type="button" value="保存"/>
</form>
<script language="javascript">
//var b_save = document.getElementById("save");
f_form1.save.onclick = function(){
alert("单击了保存按钮");
}
</script>
2.在HTML中:
<input name="bt_name" type="button" value="保存1" οnclick="alert('单击了保存按钮')" />
或(PS:此时<script>代码放的位置没有要求)
<input name="bt_name" type="button" value="保存2" οnclick="clickFunction();"/>
<script type="text/javascript">
function clickFunction(){
alert("单击了保存按钮");
}
</script>
二、DOM事件模型
1.事件流:DOM(文档对象模型)结构是一个树形结构,当一个HTML元素产生一个事件时,该事件会在元素节点与根节点之间的路径传播,路径所经过的节点都会收到该事件,这个传播的过程可称为DOM事件流。
2.主流浏览器的事件模型:
a.冒泡型事件;
b.捕获型事件;
c.DOM标准事件模型。(可以说是上述两个的结合体)
3.事件对象event
4.注册和移除事件监听器