<html>
<head>
<meta charset="utf-8" />
<title>查找元素</title>
</head>
<body>
<div>
<div>对酒当歌，人生几何</div>
<div id="zhouqi">日照香炉生紫烟，遥看瀑布挂前川</div>
<div>唧唧复唧唧，木兰当户织</div>
</div>
<div>我寄愁心与明月，随风直到夜郎西</div>
</body>
<script>
var zhouqi = document.getElementById(\'zhouqi\')
console.log(zhouqi.innerText)
// 获取前面的同胞元素
var prev = zhouqi.previousElementSibling || zhouqi.previousSibling
console.log(prev.innerText)
// 获取后面的同胞元素
var next = zhouqi.nextElementSibling || zhouqi.nextSibling
console.log(next.innerText)
// 查找父元素
var parent = zhouqi.parentNode
var uncle = parent.nextElementSibling || parent.nextSibling
console.log(uncle.innerText)
// 获取所有子元素
var children = parent.children
console.log(children[0].innerText)
// 获取第一个子元素
var first = parent.firstElementChild || parent.firstChild
console.log(first.innerText)
// 获取最后一个子元素
var last = parent.lastElementChild || parent.lastChild
console.log(last.innerText)
</script>
</html>
<html>
<head>
<meta charset="utf-8" />
<title>创建删除元素</title>
</head>
<body>
<input type="file" /><button>添加</button>
</body>
<script>
var btn = document.getElementsByTagName(\'button\')[0]
btn.onclick = function () {
// 创建一个div元素
var div = document.createElement(\'div\')
// 创建一个input元素
var input = document.createElement(\'input\')
input.type = \'file\'
// 将input元素添加到div元素中
div.appendChild(input)
// 创建一个删除按钮
var button = document.createElement(\'button\')
button.innerText = \'删除\'
// 添加事件
button.onclick = function () {
// 找到父级元素(div)
var parent = this.parentNode
// 找到祖父级元素(body)
var grand = parent.parentNode
// 删除父级元素(div)
grand.removeChild(parent)
}
// 将button元素添加到div元素中
div.appendChild(button)
// 添加元素
btn.parentNode.appendChild(div)
}
</script>
</html>