大佬教程收集整理的这篇文章主要介绍了JQuery 事件委托 事件代理，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。
<!DOCTYPE html> <html lang="en"> <head> <Meta charset="UTF-8"> <title>delegate_代表</title> <script type="text/javascript" src="js/jquery-1.12.4.min.js"></script> <script type="text/javascript"> $(function(){ // $(‘.list li‘).click(function(){ // $(this).css({‘BACkgroundColor‘:‘plum‘},) // }) // // 常规写法,此方法,在执行的时候,是把当前语句下的八个li依次进行绑定.之后添加新条件的时候就不会再进行绑定. // var $li = $(‘<li>9</li>‘); // // 新建一个变量,赋值给li变量. // $(‘.list‘).append($li); // // 把变量liappend到ul@L_450_4@里面,完成增加新元素的操作. // // 使用之前写法的话,一方面需要绑定与元素数量相等的次数,性能不好. 且,之后新添加的元素不能使用该式样. $(‘.list‘).delegate(‘li‘,‘click‘,function(){ $(this).css({‘BACkgroundColor‘:‘red‘,}) }) var $li = $(‘<li>9</li>‘); $(‘.list‘).append($li); // 这里新增元素也可以使用该式样. // 一方面是性能提升,一方面是添加新子元素也可以享受式样,减少代码量. // 所以,式样操作的时候,多使用 事件代理(委托) }) </script> <style type="text/css"> .list{ width: 100%; BACkground: tan; list-style: none; padding: 5px; } .list li{ height: 30px; BACkground: lime; margin: 10px; } </style> </head> <body> <ul class="list"> <li>1</li> <li>2</li> <li>3</li> <li>4</li> <li>5</li> <li>6</li> <li>7</li> <li>8</li> </ul> </body> </html>
以上是大佬教程为你收集整理的JQuery 事件委托 事件代理全部内容，希望文章能够帮你解决JQuery 事件委托 事件代理所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。