js与jq事件处理程序区别:

  1,事件源;

     1 document.getElementById('id'); 

     1 $("#id") 

  2,事件;

     1 document.getElementById('id').onclick; 

     1 $("#id").click 

  3,事件处理程序;

     1 document.getElementById('id').onclick=function(){ 2 3 } 

     1 $("#id").click(function(){ 2 3 }); 

  基本事件使用案例:

    

 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 2 <html xmlns="http://www.w3.org/1999/xhtml">
 3 <head>
 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 5 <title>jQuery基本使用</title>
 6 <style>
 7     #div1{ height:200px; background:#666;}
 8 </style>
 9     <!-- 引入包 -->
10 <script src="../../jQuery包/jquery-3.2.1/jquery-3.2.1.min.js"></script>
11 <script>
12     //函数入口
13     $(document).ready(function() {
14         //事件程序
15         $("#but1").click(function(){
16             $("#div1").hide();
17             });
18     });
19 </script>
20 </head>
21 
22 <body>
23     <input type="button" id="but1" value="按钮"/>
24     <div id="div1"></div>
25 </body>
26 </html>