点击一个input，事件的触发顺序 

 1 <!doctype html>
 2 <html>
 3 <head>
 4 <title>test</title>
 5 </head>
 6 <body>
 7 <a id="link" href="#">点击一下进行测试</a>
 8 <ul id="tip">
 9 <li>显示mousedown mouseup click focus事件的触发顺序</li>
10 </ul>
11 <script type="text/javascript">
12 var a=document.getElementById("link");
13 a.onclick=function(){
14 var newele=document.createElement("li");
15 newele.innerText="onclick";
16 var ele=document.getElementById("tip");
17 ele.appendChild(newele);
18 };
19 a.onfocus=function(){
20 var newele=document.createElement("li");
21 newele.innerText="onfocus";
22 var ele=document.getElementById("tip");
23 ele.appendChild(newele);
24 };
25 a.onmousedown=function(){
26 var newele=document.createElement("li");
27 newele.innerText="onmousedown";
28 var ele=document.getElementById("tip");
29 ele.appendChild(newele);
30 };
31 a.onmouseup=function(){
32 var newele=document.createElement("li");
33 newele.innerText="onmouseup";
34 var ele=document.getElementById("tip");
35 ele.appendChild(newele);
36 };
37 </script>
38 </body>
39 </html>

测试结果：

 

posted @ 2020-09-15 19:41  Shaixiang  阅读(273)  评论(0)    收藏  举报