JavaScript的事件及异常捕获
事件处理
【onClick】单击事件、【onMouseOver】鼠标经过事件、【onMouseOut】鼠标移出事件、【onChange】文本内容改变事件、【onSelect】文本被框选事件、【onFoucus】得到光标事件、【onBlur】光标失去事件、【onLoad】网页加载事件(在body标签中添加)、【onUnload】网页关闭事件(在body标签中添加或者使用window.onload=function(){})
事件注册及监听
1、 DOM0级事件处理
在标签中添加onClick或其他事件的属性并赋值为JS的自定义方法名
onClick="dongfun(20)"
两种方法在事件中得到事件的标签对象:
<div id="divid" onMouseOver="overbut(this)" onMouseOut="outbut()">东小东</div>
<script>
//通过参数传递对象
function overbut(obj){
obj.innerHTML="事件触发发,鼠标在我的范围";
}
//通过ID查找到对象
function outbut(){
document.getElementById("divid").innerHTML="再见见";
}
</script>
内容改变监听:
方法一
<input onChange="this.style.backgroundColor='red'">
方法二
<input id="inid" onChange="inputbut(this)">
<script>
function inputbut(obj){
obj.style.backgroundColor="green";//更改样式
}
</script>
2、 DOM1级事件处理
通过标签或者ID寻找到对象,进行事件监听,一个事件只能对应一个事件处理函数,在HTML中不用进行注册
function dongfunx(){
alert("东小东弹框");
}
//找到对象
var h1objx=document.getElementsByTagName("h1")[0];
//注册事件
h1objx.onclick=dongfunx;
//清除事件
h1objx.onclick=null;
3、 DOM2级事件处理
通过标签或者ID寻找到对象,进行事件监听,一个事件只能对应多个事件处理函数,在HTML中不用进行注册
//通过ID找到标签对象
divobjx=document.getElementById("divid"); //添加监听事件,可以添加多个相同或者不同的事件
//参数(事件名,处理函数名),其中事件名是普通事件中去掉“on”前缀
divobjx.addEventListener("click",onck1);
divobjx.addEventListener("click",onck2); //事件处理函数
function onck1(){
alert("----- onck1 -----");
}
function onck2(){
alert("----- onck2 -----");
} //移除点击事件
divobjx.removeEventListener("click",onck1);
匿名方法实现
divobjx=document.getElementById("divid");
divobjx.addEventListener("click",function(){
//执行操作内容
alert("----------");
});
补充:
阻止HTML的默认事件
<a href="https://www.cnblogs.com/dongxiaodong/">跳转</a>
<script>
function dongfunx(eventx){
eventx.preventDefault();//阻止默认事件,不进行跳转
}
//找到对象
var aobjx=document.getElementsByTagName("a")[0];
//注册事件
aobjx.onclick=dongfunx;
</script>
页面加载完毕监听:
window.onload=function(){
alert("页面加载完毕");
}
异常捕获
如果程序执行时遇到异常且未进行异常捕获,则程序将终止执行,如果有异常捕获,则可以继续执行异常以下的代码。
捕获所有异常:
try{
//alert(jj);//未定义变量异常
throw("东小东异常");//手动抛出异常,参数为异常内容
}catch(e){
alert("捕获的错误:"+e);
}
JavaScript的事件及异常捕获的更多相关文章
- JavaScript事件——冒泡、捕获
本节要点:1.干预系统的事件处理机制 (一)DOM事件流 (二)停止事件冒泡 (三)阻止事件的默认行为 1.干预系统的事件处理机制 (一)DOM事件流 DOM模型是一个树形结构,在DOM模型中,HTM ...
- JavaScript异常捕获
理论准备 ★ 异常捕获 △ 异常:当JavaScript引擎执行JavaScript代码时,发生了错误,导致程序停止运行: △ 异常抛出:当异常产生,并且这个异常生成一个错误信息: △ 异常捕获: ...
- Javascript异步请求你能捕获到异常吗?
Javascript异步请求你能捕获到异常吗? 异常处理是程序发布之前必须要解决的问题,不经过异常处理的应用会让用户对产品失去信心.在异常处理中,我们一贯的做法是按照函数调用的次序,将异常从数据访问层 ...
- JavaScript的事件监听、捕获和冒泡
在前端开发中,我们经常需要对某些事件进行监听.这样只要在指定的元素上触发了该事件,就会执行一个回调函数来进行相关的操作. 而JavaScript中事件监听的方法总共有三种,分别如下: element. ...
- [JavaScript] JavaScript事件注册,事件委托,冒泡,捕获,事件流
面试题 event 事件 事件委托是什么? 如何阻止事件冒泡,阻止默认事件呢? Javascript 的事件流模型都有什么? 事件绑定和普通事件有什么区别? Event 对象 Event 对象,当事件 ...
- javascript学习笔记(五):异常捕获和事件处理
异常捕获 Try{ 发生异常的代码块 }catch(err){ 异常信息处理 } <!DOCTYPE html> <html> <head lang="en&q ...
- Javascript的异常捕获机制
這個異常處理機制,之前也只是,但是沒有怎麼用過,用了一次后發現還可以, 和java,python的異常處理機制也很相似 Javascript的异常捕获机制 1.1 基本的try…catch语句 ES3 ...
- JavaScript(3)---事件冒泡、事件捕获
JavaScript(3)---事件冒泡与事件捕获 一.理解冒泡与捕获 假设有这么一段代码 <body> <div><p>标签</p> </div ...
- JavaScript事件起泡与捕获
// 向 <div> 元素添加事件句柄 document.getElementById("myDIV").addEventListener("mousemov ...
随机推荐
- redis + cookies 实现持久登入
通过登入把用户信息和token加载到redis中去, 将token和部分用户信息存储在cookie中, 下次登入时 判断cookie的token在redis中是否存在, 存在就把用户信息加载出来自动登 ...
- XP .Net 4.0使用Microsoft.Bcl需要安装XP补丁NDP40-KB2468871-v2-x86
XP .Net 4.0使用Microsoft.Bcl需要安装XP补丁NDP40-KB2468871-v2-x86
- 2019_BUAAOO_第二单元总结
第一次作业:单部多线程傻瓜调度电梯 设计策略 本次作业我才用的是生产者消费者模式,创建一个RequestList类,将输入线程InputThread作为生产者,负责将请求放入RequestList:将 ...
- win10 anaconda安装后使用报错“Original error was: DLL load failed: 找不到指定的模块”
报错:Original error was: DLL load failed: 找不到指定的模块. 环境变量需要添加3个 然后就okay了.
- 设置mysql InnoDB存储引擎下取消自动提交事务
mysql 存储引擎中最长用的有两种,MyISAM 存储引擎和InnoDB存储引擎. 1.MyISAM 存储引擎 不支持事务,不支持外键,优势是访问速度快: 2.InnoDB存储引擎 支持事务,一般项 ...
- unix的发展
转载http://blog.51cto.com/1193432/1671058
- turtle库的学习
Turtle库是Python语言中一个很流行的绘制图像的函数库,想象一个小乌龟,在一个横轴为x.纵轴为y的坐标系原点,(0,0)位置开始,它根据一组函数指令的控制,在这个平面坐标系中移动, ...
- thinkphp mysql查询结果为什么全是string问题
找到根目录下的thinkphp\library\think\db\Connection.php 文件 // PDO连接参数 protected $params = [ PDO::ATTR_CASE = ...
- CAS实现单点登录SSO执行原理及部署
一.不落俗套的开始 1.背景介绍 单点登录:Single Sign On,简称SSO,SSO使得在多个应用系统中,用户只需要登录一次就可以访问所有相互信任的应用系统. CAS框架:CAS(Centra ...
- 举例子来说明Python引用和对象
今天看到这么一句奇怪的话: python中变量名和对象是分离的:最开始的时候是看到这句话的时候没有反应过来.决定具体搞清楚一下python中变量与对象之间的细节.(其实我感觉应该说 引用和对象分离 更 ...