DOM0级事件处理、DOM2级事件处理
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<title>DOM事件</title>
</head>
<body>
<!-- 此为HTML事件，因为在HTML代码中 添加了onclick代码 -->
<input type="button" value="按钮1" id="btn1" onclick="fun1()" />
<script type="text/javascript">
function fun1(){
alert("hello world!");
}
</script> <!-- 此为DOM0级事件，不在HTML代码中添加事件，通过属性添加事件 -->
<input type="button" value="按钮2" id="btn2" >
<script type="text/javascript">
//1.第一步首先获取元素
var p=document.getElementById("btn2");
//2.第二步通过属性添加时间的函数
p.onclick=function (){
alert("这是DOM0级事件");
}
//3.通过此语句可以删除事件
//p.onclick=null;//此为删除事件
</script> <!--此为DOM2级事件，同样不在HTML代码中添加时间，用函数添加事件-->
<input type="button" value="按钮3" id="btn3">
<script type="text/javascript">
//1.第一步首先获取元素
var x=document.getElementById("btn3");
//2.第二步通过创建函数
function fun3(){
alert("这是DOM2级事件");
}
//然后通过函数 ↓事件 ↓函数名 ↓ture表示按捕获事件
// false按冒泡事件，
x.addEventListener("click", fun3, false);//false兼容个浏览器
//注意时间其实为onclick，但是DOM2级不能加on，只写后面就可以了。
</script> <!--
三种事件的比较，DOM2级事件相比于HTML事件更容日后期维护
-->
</body>
</html>
DOM0级事件处理、DOM2级事件处理的更多相关文章
- DOM0级与DOM2级
定义: 0级DOM 分为2个:一是在标签内写onclick事件 二是在JS写onlicke=function(){}函数 1) <input id="myButton" t ...
- DOM0级同DOM2级
DOM0级分为两个:一是写在标签内的onclick事件: <button id="btn" onclick="alert('happy')">按钮& ...
- javaScript——DOM1级，DOM2级，DOM3级
DOM0,DOM2,DOM3事件处理方式区别:http://www.qdfuns.com/notes/11861/e21736a0b15bceca0dc7f76d77c2fb5a.html JS中do ...
- js DOM0级事件和DOM2级事件
注册事件有两种方式,分别是DOM0级和DOM2级 DOM0级就是通过事件绑定的形式dom元素只能有(绑定)一个事件处理函数,他的特点是同一个元素绑定相同事件, 后面函数会覆盖前面的 绑定: dom.o ...
- js 中用Dom2级事件处理函数(改变样式)
下面这些客户端 javascript代码用到了事件,它给一个很重要的事件--“load" 事件注册了一个事件处理程序.同时展示了注册”click“事件处理函数更高级的一种方法 <!do ...
- 测试DOM0级事件和DOM2级事件的堆叠
1. 问题 如果大家看过北风网CJ讲师的Javascript视频教程,就可以看到其封装了一个很强的事件添加和删除函数,如下所示 function addEvent(obj, evtype, fn) { ...
- DOM0、DOM2级事件
JavaScript DOM0.DOM2级事件 1.DOM0级事件:on+事件类型 在html行内直接绑定,也就是通过行内js绑定的例如<span onclick="alert('1' ...
- 关于DOM事件流、DOM0级事件与DOM2级事件
一.DOM 事件模型 DOM 事件模型包括捕获和冒泡,捕获是从上往下到达目标元素,冒泡是从当前元素,也就是目标元素往上到 window 二.流 流的概念,在现今的 JavaScript 中随处可见.比 ...
- dom0级事件和dom2级事件
dom0级事件 <a href="#" id="hash" onclick="fn();fn1();"> <button ...
随机推荐
- iOS安全攻防之代码混淆
iOS 代码安全之代码混淆实践: 前言: 在8月份的时候写了个关于 class-dump 反编译的文章(使用 Class-dump 反编译),利用 class-dump 工具可以反编译出工程的头文件, ...
- spring annotation功能备注
@Autowired @Autowired 注释可以在 setter 方法中被用于自动连接 bean.以type方式进行匹配. 一个构造函数 @Autowired 说明当创建 bean 时,即使在 ...
- Win95+IE3 – Win10+IE11全版本执行漏洞（含POC）
微软本月安全更新修复了一个潜藏了18年的IE远程代码执行漏洞(CVE-2014-6332),可以说是给windows吃了一颗大补丸.缺陷出现在VBScript的代码中,自Windows 95首次发布( ...
- C语言到C++(1) - 基本变化
说到C++和C语言的区别,大部分人都会想到面向对象和面向过程.然而这种说法并不准确.面向对象和面向过程指的是两种不同的程序设计思想,而C++与C是两种编程语言,难道C++就不能用于面向过程去解决问题吗 ...
- MVC4加载zTree树小控件
前言: 第一次学习使用MVC框架,找了个练手项目,加载zTree树小控件.下面我就一步步说明我这次练手的经历以记录.如果有什么错误,希望各位大神帮忙指正,谢谢. 第一步: 利用VS2010新建一个MV ...
- php注册登录源代码
php注册登录源代码 链接数据库<?php$conn=mysql_connect('localhost','root','');mysql_select_db('ht',$conn);mysql ...
- UTC、GTC时间和本地时间
1.问题 对于装有Windows和Linux系统的机器,进入Windows显示的时间和Linux不一致,Linux中的时间比Windows提前8个小时. 2.解决方法 修改/etc/default/r ...
- WPF MVVM 架构 Step By Step(3)（把后台代码移到一个类中）
我觉得大部分开发者应该已经知道怎么去解决这个问题.一般都是把后台代码(GLUE code)移动到一个类库.这个类库用来代表UI的属性和行为.任何代码当被移到一个类库中时都可以被编译成一个DLL,然后可 ...
- MYSQL导入数据报错|MYSQL导入超大文件报错|MYSQL导入大数据库报错：2006 - MySQL server has gone away
导SQL数据库结构+数据时,如果数据是批量插入的话会报错:2006 - MySQL server has gone away. 解决办法:找到你的mysql目录下的my.ini配置文件(如果安装目录没 ...
- [SDOI2010]所驼门王的宝藏
题目描述 在宽广的非洲荒漠中,生活着一群勤劳勇敢的羊驼家族.被族人恭称为"先知"的Alpaca L. Sotomon是这个家族的领袖,外人也称其为"所驼门王". ...