jquery获取动态添加的元素_Web前端《~~js动态添加删除元素，点击一行、删除一行》...

html代码

实现方式(1)

删除的实现逻辑：

(1)在动态添加dom元素的时候，给每一个button添加一个clear的类名。

(2)获取页面中带有clear类名的button按钮。

(3)for循环遍历，添加onclick点击事件。

实现方式(2)

删除的实现逻辑：

(1)在动态添加dom元素的时候，给每一个button添加一个del的点击事件。

(2)并且把this传过去

(3)执行点击事件。

两个人写的代码

第一种方式@前端菜鸟的进阶之路

function add(){ var input = document.getElementById('input').value; var tableBody= document.getElementById('table-body'); var list = ""+ input +" 删除" tableBody.innerHTML += list; let clear = document.getElementsByClassName('clear'); console.log(clear); for(let i = 0; i < clear.length; i++ ){ clear[i].onclick = function () { console.log(this.parentNode.parentNode); tableBody.removeChild(this.parentNode.parentNode); } }  }

第一种方式@前端大肥肥

 var tableBody = document.getElementById('table-body'); function add(){ var input = document.getElementById('input').value; if(!input) return false; var list = ""+ input +" 删除 " tableBody.innerHTML += list; } function del(_this) {  tableBody.removeChild(_this.parentNode.parentNode); }