這篇文章主要給大家介紹了關于JavaScript中事件與異常捕獲的相關資料，文中通過示例代碼介紹的非常詳細，寫的十分的全面細致，具有一定的參考價值，對此有需要的朋友可以參考學習下。如有不足之處，歡迎批評指正。

事件處理

【onClick】單擊事件、【onMouseOver】鼠標經過事件、【onMouseOut】鼠標移出事件、【onChange】文本內容改變事件、【onSelect】文本被框選事件、【onFoucus】得到光標事件、【onBlur】光標失去事件、【onLoad】網頁加載事件（在body標簽中添加）、【onUnload】網頁關閉事件（在body標簽中添加或者使用window.οnlοad=function(){} ）
事件注冊及監聽1、 DOM0級事件處理

在標簽中添加onClick或其他事件的屬性并賦值為JS的自定義方法名

HTML復制全屏
1
onClick="dongfun(20)"

兩種方法在事件中得到事件的標簽對象：

HTML復制全屏
1
<div id="divid" onMouseOver="overbut(this)" onMouseOut="outbut()">JavaScript</div>
2
<script>
3
//通過參數傳遞對象
4
function overbut(obj){
5
obj.innerHTML="事件觸發發，鼠標在我的范圍";
6
}
7
//通過ID查找到對象
8
function outbut(){
9
document.getElementById("divid").innerHTML="再見見";
10
}//
11
</script>

內容改變監聽：
方法一

HTML復制全屏
1
<input onChange="this.style.backgroundColor='red'">

方法二

HTML復制全屏
1
<input id="inid" onChange="inputbut(this)">
2
<script>
3
function inputbut(obj){
4
obj.style.backgroundColor="green";//更改樣式
5
}
6
</script>

2、 DOM1級事件處理
通過標簽或者ID尋找到對象，進行事件監聽，一個事件只能對應一個事件處理函數，在HTML中不用進行注冊

HTML復制全屏
1
function dongfunx(){
2
alert("JavaScript彈框");
3
}
4
//找到對象
5
var h1objx=document.getElementsByTagName("h1")[0];
6
//注冊事件
7
h1objx.οnclick=dongfunx;
8
//清除事件
9
h1objx.οnclick=null;

3、 DOM2級事件處理

通過標簽或者ID尋找到對象，進行事件監聽，一個事件只能對應多個事件處理函數，在HTML中不用進行注冊

HTML復制全屏
1
//通過ID找到標簽對象
2
divobjx=document.getElementById("divid");
3
?
4
//添加監聽事件，可以添加多個相同或者不同的事件
5
//參數（事件名，處理函數名），其中事件名是普通事件中去掉“on”前綴
6
divobjx.addEventListener("click",onck1);
7
divobjx.addEventListener("click",onck2);
8
?
9
//事件處理函數
10
function onck1(){
11
alert("----- onck1 -----");
12
}
13
function onck2(){
14
alert("----- onck2 -----");
15
}//
16
?
17
//移除點擊事件
18
divobjx.removeEventListener("click",onck1);

匿名方法實現

HTML復制全屏
1
divobjx=document.getElementById("divid");
2
divobjx.addEventListener("click",function(){
3
//執行操作內容
4
alert("----------");
5
});

補充：
阻止HTML的默認事件

HTML復制全屏
1
<a href="https://www.cnblogs.com/dongxiaodong/" rel="external nofollow" >跳轉</a>
2
<script>
3
function dongfunx(eventx){
4
eventx.preventDefault();//阻止默認事件，不進行跳轉
5
}
6
//找到對象
7
var aobjx=document.getElementsByTagName("a")[0];
8
//注冊事件
9
aobjx.οnclick=dongfunx;
10
</script>

頁面加載完畢監聽：

HTML復制全屏
1
window.οnlοad=function(){
2
alert("頁面加載完畢");
3
}//

異常捕獲

如果程序執行時遇到異常且未進行異常捕獲，則程序將終止執行，如果有異常捕獲，則可以繼續執行異常以下的代碼。
捕獲所有異常：

HTML復制全屏
1
try{
2
//alert(jj);//未定義變量異常
3
throw("JavaScript異常");//手動拋出異常，參數為異常內容
4
}catch(e){
5
alert("捕獲的錯誤:"+e);
6
}

結語

想學前端的看我個性簽名哦

總結

以上是生活随笔為你收集整理的js监听多个事件_JavaScript中的事件与异常捕获解析的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。