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& ...
随机推荐
- uva-519-拼图
给你N*M个碎片,问能否用他们拼成一个矩形,矩形的边缘要全是F,除外界边缘的边要么是I,要么O,不能是F1.碎片会重复出现,所以同样的碎片在同一个位置,如果已经不能放,直接跳过就行2.矩形的边缘要全是 ...
- maven 插件2
Maven is - at its heart - a plugin execution framework; all work is done by plugins. Maven 本质上就是一个插件 ...
- <转载>C#与JAVA的区别 http://www.cnblogs.com/Asa-Zhu/archive/2012/11/08/2761114.html
C#(C-Sharp)是Microsoft的新编程语言,被誉为“C/C++家族中第一种面向组件的语言”.然而,不管它自己宣称的是什么,许多人认为C#更像是Java的一种克隆,或者是Microsoft用 ...
- oracle 相关操作
1,SqlPlus 的使用 1.01,软登入:sqlplus /nolog 1.02,登入 dba 用户:sqlplus /as sysdba 2,用户相关操作 2.01,创建用户:create us ...
- spark Kryo serialization failed: Buffer overflow 错误
今天在写spark任务的时候遇到这么一个错误,我的spark版本是1.5.1. Exception in thread "main" com.esotericsoftware.kr ...
- delphi dxBarManager 的dxBarEdit 输入问题
Developer Express 6 想做像office2007那样界面. 问题:dxBarManager1 里面添加了cxBarEditItem1 这是个文本框,运行可以输入内容,但是当焦点失去时 ...
- UNITY2018 真机开启deepprofiling的操作
手机上运行游戏并开启deepprofiling的命令如下 命令一:adb shell am start -n com.szyh.YHP1.kaopu/com.szyh.YHP1.kaopu.MainA ...
- How to Pronounce Numbers 11 – 19
How to Pronounce Numbers 11 – 19 Share Tweet Share Tagged With: Numbers Numbers are something you’ll ...
- Hydra密码破译工具
Hydra简介 Hydra是著名黑客组织thc开发的一款开源的暴力密码破解工具,可以在线破解多种密码,目前已经被Backtrack和kali等渗透平台收录.除了命令行下的Hydra外,还提供了Hydr ...
- Mysql数据库如何创建用户
创建test用户,密码是1234. MySQL u root -p CREATE USER 'test'@'localhost' IDENTIFIED BY '1234'; #本地登录 CREATE ...