08-操作节点

创建元素的三种方式

1.document.write()

document.write(" ");

2.innerHTML

var box = document.getElementById("box");

box.innerHTML = " ";

覆盖的时候可以用

结构复杂的时候可以用

3.document.createElement()

var div = document.createElement("div")

document.body.appendChild(div);

不覆盖

结构相对比较简单的时候

根据节点关系对节点进行查找

父节点.childNodes    可以得到所有的子节点

父元素.children        可以得到所有的子元素

子节点.parentNode    可以得到该节点的父节点

节点.nextSibling        得到下一个兄弟节点

--------------------------------------------------------------

追加

父元素.appendChind(子节点)

作用:把子节点作为父元素的最后的一个子节点

插入

父元素.insertBefore(新元素,旧元素)

作用:将新元素作为父元素的子元素,插入在旧元素前

删除

父元素.removeChild(子元素);

替换

父元素.repalceChind(新,旧)

克隆

cloneNode

------------------------------------------------------------------------

*  增

*      innerHTML、document.createElement

*

*  删    removeChild  innerHTML=""

*

*

*  改

*      改属性    标准属性,自定义属性,setAttribute.....

*      改样式    className,style

*      改内容    innerHTML/innerText/value

*      改位置    appendChild/insertBefore/replaceChild

*

*  查    根据id，根据标签名,根据类名,根据name属性，根据选择器

*        节点关系