热门标签 | HotTags
当前位置:  开发笔记 > 前端 > 正文

JavaScript中的事件与异常捕获详析

这篇文章主要给大家介绍了关于JavaScript中事件与异常捕获的相关资料,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面来一起学习学习吧

事件处理

【onClick】单击事件、【onMouseOver】鼠标经过事件、【onMouseOut】鼠标移出事件、【onChange】文本内容改变事件、【onSelect】文本被框选事件、【onFoucus】得到光标事件、【onBlur】光标失去事件、【onLoad】网页加载事件(在body标签中添加)、【onUnload】网页关闭事件(在body标签中添加或者使用window.Onload=function(){}

事件注册及监听

1、 DOM0级事件处理

在标签中添加onClick或其他事件的属性并赋值为JS的自定义方法名

OnClick="dongfun(20)"

两种方法在事件中得到事件的标签对象:

东小东

内容改变监听:

方法一

 

方法二


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的默认事件

页面加载完毕监听:

 window.Onload=function(){
 alert("页面加载完毕");
 }

异常捕获

如果程序执行时遇到异常且未进行异常捕获,则程序将终止执行,如果有异常捕获,则可以继续执行异常以下的代码。

捕获所有异常:

try{
 //alert(jj);//未定义变量异常
 throw("东小东异常");//手动抛出异常,参数为异常内容
}catch(e){
 alert("捕获的错误:"+e);
 }

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,如果有疑问大家可以留言交流,谢谢大家对的支持。


推荐阅读
  • 本文介绍如何在已拥有签名密钥的情况下为 Ionic 3 开发的 Android 应用程序添加签名。如果您尚未创建签名文件,建议先参考相关指南完成该步骤。 ... [详细]
  • 14款免费网站访客行为分析工具推荐
    探索14款免费的网站访客行为分析工具,帮助你深入了解访客为何离开你的网站,并提供策略以提高用户留存率和转化率。 ... [详细]
  • 教程:如何打造令人印象深刻的GitHub个人主页Readme
    本文将指导您如何创建一个既专业又个性化的GitHub个人主页Readme,通过添加统计数据、常用语言和最近活动等元素,让您的主页更加吸引人。 ... [详细]
  • POJ2226 二分图最小覆盖问题
    在一个大小为n×m的网格中,部分单元格为泥泞状态,其余为干净。目标是使用宽度固定为1但长度可变的木板覆盖所有泥泞单元格,且不覆盖任何干净单元格。木板允许重叠。本问题通过构建二分图并求其最小覆盖来解决。 ... [详细]
  • 本文探讨了归并排序算法在求解逆序数问题中的应用,并对比分析了两种实现方法。第一种方法使用指针和动态数组,存在内存管理上的风险;而第二种方法通过引入临时数组简化了实现过程,提高了代码的健壮性和可读性。 ... [详细]
  • PyQt5中进度条(QProgressBar)的使用指南
    本文介绍了如何在PyQt5中使用进度条(QProgressBar)来展示任务的完成情况。包括初始化进度条、设置其最大最小值以及更新进度的方法。 ... [详细]
  • 本文基于Robert C. Martin在其著作《清洁代码》第17章中的观点,深入分析了代码实践中常见的‘代码气味’现象,并提出了改进方法实现的具体建议。 ... [详细]
  • Linux 存储堆栈架构图
    本文提供了一张清晰的Linux存储堆栈架构图,并对比了多种iSCSI后端解决方案,如LIO和STGT。文中还提供了详细的资源链接,帮助读者深入了解这些技术。 ... [详细]
  • 远程访问用户 Kindle通过电子书实现控制
    介绍自2007年以来,亚马逊已售出数千万台Kindle,令人印象深刻。但这也意味着数以千万计的人可能会因为这些Kindle中的软件漏洞而被黑客入侵。他 ... [详细]
  • Linux系统中高效解决高Buff/Cache占用问题
    本文详细探讨了在Linux系统中遇到的高Buff/Cache占用问题及其解决方案,提供了手动清除与定时任务自动化处理的方法。 ... [详细]
  • PHP 编程中的巧妙代码实例
    探索为何多数程序员难以晋升为架构师,本文通过几个PHP编程实例,揭示了一些常见的编码误区和高级技巧。 ... [详细]
  • 死锁的概念“死锁”指的是:多个线程各自占有一些共享资源,并且互相等待其他线程占有的资源才能进行,而导致两个或者多个线程都在等待对方释放资源 ... [详细]
  • Windows 系统中 Flutter 与 IntelliJ IDEA 的环境配置指南
    本指南详细介绍了如何在 Windows 操作系统上设置 Flutter 开发环境,并集成至 IntelliJ IDEA 中,适合初学者及专业人士参考。 ... [详细]
  • 本文旨在探讨《现代通信原理》(第三版)中绪论部分的核心知识点,通过深入分析与实例解析,帮助读者更好地理解通信基础理论。 ... [详细]
  • 本文探讨了一种方法,通过开发C#应用程序来拦截并处理从遗留系统发出的Http请求,该系统原本依赖于已停止服务的Web服务。解决方案涉及使用代理技术或HTTP监听器来捕获和重定向这些请求。 ... [详细]
author-avatar
mizrke
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有