<style> #box { width: 500px; height: 500px; background-color: pink; } </style></head><body><!--点击按钮，在div里面创建一个新的p元素--><input type="button" value="按钮" id="btn"><div id="box"> <div> <span>呵呵</span> <p>11111</p> <p>22222</p> <p>33333</p> <p>44444</p> </div></div><script src="jquery-1.12.4.js"></script><script> $(function () { //简单事件，给自己注册的事件 缺点：一次只能注册一个事件 $("div").click(function () { alert("哈哈"); }); //bind方式 $("p").bind({ click:function () { alert("呵呵") }, mouseenter:function () { alert("哈哈") } }); $("#btn").click(function () { $("<p>我是新增加的p元素</p>").appendTo("div"); }); //delegate:代理，委托 //1. 给父元素注册委托事件，最终还是有子元素来执行。 //要给div注册一个委托事件,但是最终不是由执行，而是有p执行 //第一个参数：selector:事件最终由谁来执行。 //第二个参数：事件的类型 //第三个参数：函数，要做什么 //1. 动态创建的也能有事件 :缺点：只能注册委托事件 $("#box").delegate("p", "click", function () { //alert("呵呵"); console.log(this); }); });</script>
来源：https://www.cnblogs.com/lujieting/p/10110790.html