dom导航和操纵元素
2022-03-11 本文已影响0人
苍老师的眼泪
dom.jpg
image.png
<!DOCTYPE html>
<html lang="en">
<body>
<div id="a">
<div id="b"></div><div id="c">
<div id="d"></div>
</div>
</div>
<button onclick="dianji()">点击</button>
<script>
console.log(a.childNodes)
console.log(a.firstChild)
console.log(a.hasChildNodes())
console.log(a.lastChild)
console.log(b.nextSibling)
console.log(b.parentNode)
console.log(c.previousSibling)
</script>
<script>
function dianji() {
var new_element = document.createElement('p')
new_element.innerText = 'new_element'
a.appendChild(new_element)
a.insertBefore(new_element, b)
c.removeChild(d)
a.replaceChild(new_element, b)
}
</script>
</body>
</html>
1922c4bbedc2878b1f16b3959fb2cd9.jpg
