const params = document.getElementById('params')
const ul = params.querySelector('ul')
const addBtn = ul.querySelector('#add')
addBtn.onclick = function (e) {
const newli = document.createElement('li')
newli.appendChild(document.createElement('input'))
const btn = document.createElement('input')
btn.setAttribute('type', 'button')
btn.setAttribute('value', '删除')
btn.setAttribute('opt-type', 'del')
newli.appendChild(btn)
ul.appendChild(newli)
}
ul.onclick = function (e) {
const target = e.target
const optType = target.getAttribute('opt-type')
if (target.nodeName === 'INPUT' && target.type === 'button' && optType === 'del') {
this.removeChild(target.parentNode)
}
}
} <div id="params">
<ul>
<li><input type="text"><input id="add" type="button" value="添加一行"></li>
</ul>
</div>
点击"添加一行",生成一条li,包含input,然后append进ul里边。点击删除,用ul删除按钮父元素li。
<html><script language="javascript">
function createTr(){
var tb=document.all.tb
var tr=tb.insertRow()
var td=tr.insertCell()
td.innerHTML="test"
td.onclick=clickMe
}
function clickMe(){
alert("事件")
}
</script>
<body>
<table id="tb" border="2">
<tr>
<td onclick="createTr()">click me</td>
</tr>
</table>
</body>
</html>
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)