如何使用原生js来删除节点

JavaScript032

如何使用原生js来删除节点,第1张

删除属性使用 removeAttribute方法。

删除节点使用 parentNode.removeChild(node)

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8" />

<meta http-equiv="X-UA-Compatible" content="IE=edge">

<title>Page Title</title>

<meta name="viewport" content="width=device-width, initial-scale=1">

<script type="text/javascript">

onload=function(){

btn.onclick=function(){

var container = document.querySelector('#container')

var textInput = document.querySelector('#text')

var testBtn = document.querySelector('#test')

testBtn.removeAttribute('onclick')

container.removeChild(textInput)

}

}

</script>

</head>

<body>

<div id="container">

<input type="text" name="text" id="text" value="" />

<input type="button" value="仅作测试" id="test" onclick ="javascript:alert('存在点击事件Attribute')" />

<input type="button" value="删除按钮的onclick及id=text的文本框" id="btn" />

</div>

</body>

</html>

把 d.item(i).onclick=function(){

var n=d.item(i)

n.parentNode.remove(n)

}

改成d.item(i).onclick=function(){

this.parentNode.removeChild(this)

}

我的方法：

window.onload=function(){

var i=0

document.ondblclick= function(){

i++

var o= document.createElement('div')

o.style.cssText='width:100pxheight:50pxborder:1px solid #f00margin-top:1px'

o.innerHTML=i

document.body.appendChild(o)

var d= document.getElementsByTagName('div')

for(var j=0j<d.lengthj++){

d[j].onclick=function(){

this.parentNode.removeChild(this)

}

}

}

}