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);
}

posted on 2020-12-18 11:42  心灯不夜  阅读(183)  评论(0编辑  收藏  举报