您的位置：首页 > Web前端 > JavaScript

javascript学习笔记（五）：异常捕获和事件处理

2017-06-13 10:47 316 查看

异常捕获

Try{

　　发生异常的代码块

}catch(err){

　　异常信息处理

}

1 <!DOCTYPE html>
2 <html>
3 <head lang="en">
4     <meta chaset="UTF-8">
5     <title></title>
6 </head>
7 <body>
8     <form>
9         <input id="txt" type="text">
10         <input id="btn" type="button" onclick="demo()" value="按钮">
11     </form>
12     <script>
13         function demo(){
14             try{
15                 var e = document.getElementById("txt").value;
16                 if(e==""){
17                     throw "请输入";   //一般throw会与try,catch配合使用
18                 }
19             }catch(err){
20                 alert(err);
21             }
22         }
23     </script>
24 </body>
25 </html>

事件处理

1、onclick鼠标点击事件

2、onmouseout鼠标离开事件

3、onmouseover鼠标经过事件

4、onchange文本框内容改变事件

5、onselect文本框内容选中事件

6、onfocus光标聚集事件

7、onload网页加载完毕事件

样式表style.css

1 .div{
2     width: 100px;
3     height: 100px;
4     background-color: red;
5 }

1 <!DOCTYPE html>
2 <html>
3 <head lang="en">
4     <meta chaset="UTF-8">
5     <title></title>
6     <link rel="stylesheet" type="text/css" href="style.css"> <!--指定rel为样式表，类型为css，外部文件为style.css-->
7 </head>
8 <body onload="onLoad()"> 　　　　　　　　　　　　　　　　　　　　  <!--onload网页加载完毕事件-->
9     <button onclick="onClick()">按钮</button>   　　　　　　　　<!--onclick鼠标点击事件-->
10     <div class="div" onmouseout="onOut(this)" onmouseover="onOver(this)"></div> <!--onmouseout鼠标离开事件，onmouseover鼠标经过事件 -->
11     <form>
12         <input type="text" onchange="onChange(this)"> 　　　　<!--onchange文本框内容改变事件-->
13         <br>
14         <input type="text" onselect="onSelect(this)" onfocus="onFocus(this)">   <!--onselect文本框内容选中事件，onfocus光标聚集事件-->
15     </form>
16     <script>
17         function onClick(){
18             alert("onclick鼠标点击");
19         }
20         function onOver(ooj){
21             ooj.innerHTML="onmouseover鼠标经过";
22         }
23         function onOut(ooj){
24             ooj.innerHTML="onmouseout鼠标离开";
25         }
26         function onChange(bg){
27             alert("onchange文本框内容改变");
28         }
29         function onSelect(bg){
30             bg.style.background="yellow";
31             alert("onselect文本框内容选中");
32         }
33         function onFocus(bg){
34             bg.style.background="green";
35             alert("onfocus光标聚集");
36         }
37         function onLoad(){
38             alert("onload网页加载完毕");
39         }
40     </script>
41 </body>
42 </html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航