6JQuery事件1event01.html

游鹄君2025年8月24日小于 1 分钟
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>jQuety 事件</title>
  <script type="text/javascript" src='jquery-1.8.3.min.js'></script>
</html>
  <style type="text/css">
    li{width:100px;height:40px;border:solid 1px red;}
  </style>
</head>
<body> 
  <script type="text/javascript">
    //alert($);
    //页面文档加载事件
    // 第一种样式
    /*$(document).ready(function(){
     $('button').click(function(){
       alert(1234);
     })
    });
    */
    //第二种样式
    $(function(){
     //基本事件
     /*$('button').click(function(){
       alert(1234);
     })*/
     //方法事件
     /*$('button').bind('click',function(){
       alert(11234);
     });
*/
     //解绑
     /*$('button').unbind();*/
 
     //动态绑定事件 据说只有低版本能用 不同于clone
     $('button').click(function(){
       $('<li>军事</li>').appendTo('body');
     })
 
     $('li').live('click',function(){
       alert(1234);
     })
    })
  </script>
  <button >单击</button>
  <li>体育</li>
</body>
</html>