createElement 創(chuàng)建元素對(duì)象
createTextNode 創(chuàng)建文本節(jié)點(diǎn)
appendChild把元素添加到容器末尾
insertBefore把元素添加到指定容器中指定元素的前面
<script>
//動(dòng)態(tài)創(chuàng)建一個(gè)DIV元素對(duì)象，把其賦給BOX
let box = document.createElement('div');
box.id = 'boxActive';
box.style.width = '200px';
box.style.height = '200px';
box.className= 'RED';
// 動(dòng)態(tài)創(chuàng)建一個(gè)文本
let text = document.createTextNode('js練習(xí)')
// 添加: 容器.appendChild(元素)
box.appendChild(text);
// document.body.appendChild(box);
// 放到指定元素前：容器.insertBefore([新增元素],[指定元素])
let hh = document.getElementById('hh');
// hh.parentNode.insertBefore(...)
document.body.insertBefore(box, hh);
</script>
cloneNode（true/false）克隆元素或節(jié)點(diǎn)
removeChild移除容器中某個(gè)元素
<div class="box">
<span>dom操作練習(xí)</span>
</div>
<script>
let box1 = document.querySelector('.box');
// 克隆第一份(深克隆)
let box2 = box1.cloneNode(true);
box2.querySelector('span').innerText = 'jsdom訓(xùn)練2'
// 克隆第二份（淺克隆）
let box3 = box1.cloneNode(false);
box3.innerHTML="<span>jsdom訓(xùn)練3</span>";
document.body.appendChild(box2);
document.body.appendChild(box3);
// ===========
// 容器.removeChild(元素)
document.body.removeChild(box2);
</script>
