javascript学习笔记（七）：事件详解
HTML事件处理
<!DOCTYPE html>
<html>
<head lang="en">
<meta chaset="UTF-8">
<title></title>
</head>
<body>
<button onclick="demo()">按钮</button>
<script>
function demo(){
alert("html事件处理");//缺点是修改一处就要修改两处
}
</script>
</body>
</html>
DOM 0级事件处理
<!DOCTYPE html>
<html>
<head lang="en">
<meta chaset="UTF-8">
<title></title>
</head>
<body>
<div>
<button id="btn">按钮</button>
</div>
<script>
var btn = document.getElementById("btn");
btn.onclick = demo; //DOM 0级事件处理
btn.onclick = demo2; //有个弊端是后面的语句会覆盖前面的语句，这里只弹demo2窗。
function demo(){
alert("DOM 0级事件处理");
}
function demo2(){
alert("DOM 0级事件处理2");
}
</script>
</body>
</html>
DOM 2级事件处理
<!DOCTYPE html>
<html>
<head lang="en">
<meta chaset="UTF-8">
<title></title>
</head>
<body>
<div>
<button id="btn">按钮</button>
</div>
<script>
var btn = document.getElementById("btn");
btn.addEventListener("click",demo); //添加DOM 2级事件
btn.addEventListener("click",demo2); //相对DOM 0级事件的优点是不会覆盖上面的事件，依次弹窗两次
btn.removeEventListener("click",demo); //清除DOM 2级事件 function demo(){
alert("DOM 2级事件处理");
}
function demo2(){
alert("DOM 2级事件处理2");
} </script>
</body>
</html>
javascript学习笔记（七）：事件详解的更多相关文章
- expect学习笔记及实例详解【转】
1. expect是基于tcl演变而来的,所以很多语法和tcl类似,基本的语法如下所示:1.1 首行加上/usr/bin/expect1.2 spawn: 后面加上需要执行的shell命令,比如说sp ...
- Redis学习笔记4-Redis配置详解
在Redis中直接启动redis-server服务时, 采用的是默认的配置文件.采用redis-server xxx.conf 这样的方式可以按照指定的配置文件来运行Redis服务.按照本Redi ...
- Docker技术入门与实战 第二版-学习笔记-3-Dockerfile 指令详解
前面已经讲解了FROM.RUN指令,还提及了COPY.ADD,接下来学习其他的指令 5.Dockerfile 指令详解 1> COPY 复制文件 格式: COPY <源路径> .. ...
- Android学习笔记之Activity详解
1 理解Activity Activity就是一个包含应用程序界面的窗口,是Android四大组件之一.一个应用程序可以包含零个或多个Activity.一个Activity的生命周期是指从屏幕上显示那 ...
- Struts2学习笔记(二)——配置详解
1.Struts2配置文件加载顺序: default.properties(默认常量配置) struts-default.xml(默认配置文件,主要配置bean和拦截器) struts-plugin. ...
- Struts2学习笔记二 配置详解
Struts2执行流程 1.简单执行流程,如下所示: 在浏览器输入请求地址,首先会被过滤器处理,然后查找主配置文件,然后根据地址栏中输入的/hello去每个package中查找为/hello的name ...
- [C#] 类型学习笔记二：详解对象之间的比较
继上一篇对象类型后,这里我们一起探讨相等的判定. 相等判断有关的4个方法 CLR中,和相等有关系的方法有这么4种: (1) 最常见的 == 运算符 (2) Object的静态方法ReferenceEq ...
- vue.js学习笔记(二)——vue-router详解
vue-router详解 原文链接:www.jianshu.com 一.前言 要学习vue-router就要先知道这里的路由是什么?为什么我们不能像原来一样直接用<a></a> ...
- linux命令学习笔记-eval命令详解
功能说明:重新运算求出参数的内容. 语 法:eval [参数] 补充说明:eval可读取一连串的参数,然后再依参数本身的特性来执行. 参 数:参数不限数目,彼此之间用分号分开. .eval命令将会首先 ...
- Javascript学习之三元运算符详解
本文主要是通过实例为大家介绍javascript三元运算符相关内容,希望对初学者学习这部分内容有所帮助. 实例 <!DOCTYPE html> <html> <head& ...
随机推荐
- 5、申请开发(Development)描述文件
申请开发(Development)描述文件 在“Certificates, Identifiers & Profiles”页面“Provisioning Profiles”下选择“Develo ...
- 4、申请开发(Development)证书和描述文件
开发(Development)证书用于测试环境下使用,可以直接安装到手机上(不用提交到Appstore),但一个描述文件最多只能绑定100台设备(因此通过这种证书正式发布应用是行不通的). 申请开发( ...
- oracle 多行合并为一行
sys_connect_by_path select i,ltrim(max(sys_connect_by_path(a,',')),',') afrom(select i,a,d,min(d) ov ...
- iOS第三方登录qq
http://blog.sina.com.cn/s/blog_7b9d64af0101e5vj.html
- 制作签名jar放置到前端资源目录下
给jar包打签名keytool -genkey -keystore myKeystore -alias jwstest查看签名信息jarsigner -keystore myKeystore data ...
- Java base64 图片编码转换
package com.test; import org.junit.Test; import sun.misc.BASE64Decoder; import sun.misc.BASE64Encode ...
- Ubuntu下无法使用Secure_CRT连接服务器
虚拟机使用 1 .指令安装了SSH服务器 sudo apt-get install openssh-server 2. 输入命令 ps | grep ssh 查看SSH服务是否开启 显示服务已开启 3 ...
- PHP提取HTML代码中img标签下src属性
需求:提取整片文章中img的src属性,并保存到一个数组当中 preg_match_all("/(href|src)=([\"|']?)([^\"'>]+.(jpg ...
- ThinkPHP同时操作多个数据库
除了在预先定义数据库连接和实例化的时候指定数据库连接外,我们还可以在模型操作过程中动态的切换数据库,支持切换到相同和不同的数据库类型.用法很简单, 只需要调用Model类的db方法,用法: $this ...
- PHP斐波那契数列
一个斐波那契数列的求法 1 1 2 3 5 8 13 21 34 55 要求写出算法 //数组法 function test($num){ $arr=[]; for($i=0;$i<=$nu ...