DOM创建节点的方法:
document.createElement(Tag),Tag必须是合法的HTML元素
DOM复制节点的方法:
节点cloneNode(boolean deep),当deep为true时,表示复制当前节点以及当前结点的全部后代节点。为false时,只复制当前节点。
appendChild(newNode) |
将newNode添加成当前节点的最后一个子节点 |
insertBefore(newNode,refNode) |
将refNode节点之前插入newNode节点 |
replaceChild(newNode,oldNode) |
将oldNode节点替换成newNode节点 |
removeChild(oldNode) |
将oldNode子节点删除 |
//获取表格的元素节点
var t=document.getElementById("mytable");
//写一个通用方法获取元素节点的文本节点
function get(myNode){
alert(myNode.innerHTML);
}
//修改表格的值
function update(){
//获取行
var r=document.getElementById("row").value;
//获取列
var c=document.getElementById("cell").value;
//获取要修改后的值
var cc=document.getElementById("course").value;
t.rows[r-1].cells[c-1].innerHTML=cc;
}
//获取父节点
var ul=document.getElementById("city");
function create(){
//创建li元素节点
var li=document.createElement("li");
li.innerHTML="淄博";
//将li添加到ul
ul.appendChild(li);
}
function insert(){
//创建li元素节点
var li=document.createElement("li");
li.innerHTML="济南";
//获取所有li所在的数组
var lis=ul.getElementsByTagName("li");
//将新元素节点插入到第一个元素前
ul.insertBefore(li,lis[0]);
}
function update(){
var li=document.createElement("li");
li.innerHTML="山东";
var lis=ul.getElementsByTagName("li");
ul.replaceChild(li,lis[0]);
}
function copy(){
var li=ul.getElementsByTagName("li")[0];
var newli=li.cloneNode(true);
ul.appendChild(newli);
}
function del(){
var li=ul.getElementsByTagName("li")[0];
ul.removeChild(li);
}