这次给大家带来js给动态创建元素添加事件步骤详解，js给动态创建元素添加事件的注意事项有哪些，下面就是实战案例，一起来看一下。
html中直接生成的元素，添加事件，我们都知道，但是如何为一个动态生成的元素添加事件呢，jquery中的live方法可以做到这一点
具体实现可以在demo中看到
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>js实现为动态创建的元素添加事件</title>
<script src="js/lib/jquery-1.7.2.min.js"></script>
</head>
<body>
<button id="btn">添加事件</button>
<p id="panel"></p>
<script>
// js原生实现
// var btn=document.getelementbyid(btn);
// btn.onclick=function(){
// var arr= [];
// for(var i=0;i<10;i++){
// arr.push("<p id='nep'>+i+</p>);
// }
//
// document.getelementbyid(panel).innerhtml=arr.join('<br/>');
// }
//
//jquery部分实现
$(#btn).click(function(){
var arr= [];
for(var i=0;i<10;i++){
arr.push("<p id='nep'>+i+</p>);
}
$(#panel).html(function(){
return arr.join(<br/>);
});
});
//为动态创建的html标签元素添加事件
$(#nep).live(click,function(){
var that=$(this);//获取当前点击的this对象
console.log(that.text());
});
</script>
</body>
</html>
运行结果：
相信看了本文案例你已经掌握了方法，更多精彩请关注其它相关文章！
推荐阅读：
js解析数据技巧总结
js中dom事件绑定使用小技巧
以上就是js给动态创建元素添加事件步骤详解的详细内容。