1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Title</title> 6 </head> 7 <body> 8 <ul> 9 <li>锄禾日当午</li> 10 <li>汗滴禾下土</li> 11 <li>谁知盘中餐</li> 12 <li>粒粒皆辛苦</li> 13 </ul> 14 <button>添加</button> 15 <script src="jquery-3.3.1.min.js"></script> 16 <script> 17 // 事件表达方式一： 18 // $('ul li').click(function () { 19 // alert(1111) 20 // }); 21 22 // 事件表达方式二bind(函数名，函数) 23 // $('ul li').bind('click',function () { 24 // alert(22222) 25 // }); 26 // 27 $('button').click(function () { 28 var $ele=$('<li>'); 29 var len=$('ul li').length; 30 $ele.html(len+1); 31 $('ul').append($ele) 32 33 }); 34 35 36 37 // 事件委托 38 $('ul').on('click','li',function () { 39 alert(0000) 40 }) 41 </script> 42 </body> 43 </html>