1.創(chuàng)建元素 插入元素
①創(chuàng)建元素節(jié)點(diǎn) createElement()
②創(chuàng)建文本節(jié)點(diǎn) createTextNode()
③把新的節(jié)點(diǎn)添加到子節(jié)點(diǎn)荸恕,也可以把文本節(jié)點(diǎn)添加到空節(jié)點(diǎn)中 appendChild()
④刪除子節(jié)點(diǎn) removeChild()
⑤在指定的子節(jié)點(diǎn)前面插入新的子節(jié)點(diǎn)。 insertBefore()
let box = document.getElementById('box');
let a = document.createElement('section'); //創(chuàng)建一個(gè)元素節(jié)點(diǎn)蹬屹,內(nèi)容為空 <section></section>
let b = document.createTextNode('Kolento'); //創(chuàng)建一個(gè)文本節(jié)點(diǎn) Kolento
a.appendChild(b); //把b的內(nèi)容放入a節(jié)點(diǎn)中 <section>Kolento</section>
//此時(shí)如果需要把a(bǔ)節(jié)點(diǎn)插入 id=box 節(jié)點(diǎn)中
box.appendChild(a);
box.insertBefore(a,box.childNodes[0]); //在第1個(gè)子節(jié)點(diǎn)前插入節(jié)點(diǎn)
//結(jié)果如下
<div id="box">
<section>Kolento</section>
</div>
box.childNodes; //返回?cái)?shù)組 box下的子節(jié)點(diǎn)集
box.removeChild(box.childNodes[0]) //刪除第一個(gè)子節(jié)點(diǎn)
2.創(chuàng)建柏蘑,修改狂窑,獲取元素屬性
\let box = document.getElementById('box');
box.setAttribute('test','yes'); //創(chuàng)建屬性
box.setAttribute('test','no'); //修改屬性
box.getAttribute('test'); //獲取屬性 no