DOM的基本操作1

DOM树结构：

举个例子： html:

<div></div>

js:

var div = document.getElementsByTagName('div')[0]; var span = document.createElement('span');//增 var text = document.createTextNode('123');//增 var comment = document.createComment('this is comment');//增 div.appendChild(span);//插 div.appendChild(text);//插 div.appendChild(comment);//插

PARENTNODE.insertBefore(a,b) 将元素a插入到元素b前面

举个例子： html：

<div> <span></span> <p></p> <strong></strong> </div>

js:

var div = document.getElementsByTagName('div')[0]

现在我们要把em标签插入到p标签前面

所以就要在JS中进行修改 js:

var div = document.getElementsByTagName('div')[0]; var p = document.getElementsByTagName('p')[0]; var em = document.createElement('em');//增 div.insertBefore(em,p);

现在我们要把strong标签删掉。

在js:

var div = document.getElementsByTagName('div')[0]; var p = document.getElementsByTagName('p')[0]; var em = document.createElement('em'); div.insertBefore(em,p); var strong = document.getElementsByTagName('strong')[0]; div.removeChild(strong);//删

例如先我们要用一个新的标签hr代替div中的便签p