DOM创建节点:document.createElement(Tag)。
DOM复制节点:cloneNode(boolean deep),当deep为true时，表示复制当前节点以及当前节点的全部后代节点。为false时，只复制当前节点。
如function copy()
var li=ul.getEleentByTagName("li")[0];
//var newli=li.cloneNode(false);
var newli=li.cloneNode(true);
ul.appendChild(newli);
{
replaceChild(newNode,oldNode)将oldNode节点替换成newNode节点。
removeChild(oldNode)将old子节点删除。
如function del(){
//获取最后一个节点的下标
var index=ul.getElementsByTagName("li").length-1;
//获取最后一个元素节点
var li=ul.getElementsByTagName("li")[index];
//删除节点
ul.removeChild(li);
}
DOM为下拉菜单添加选项：new Option(text,value,defaultSelected,selected),该构造器有四个参数（text、value、defaultSelectde(设置默认是否显示该选项）、selected（设置该选项当前是否被选中))。同时并不是每一次构造都需指明4个参数，一个的时text，2个的是value.
直接为select的指定选项赋值。列表框或下拉菜单对象.options[i]=创建好的option对象。
直接使用列表框或下拉菜单对象.remove(index)方法删除指定选项，直接将指定选项赋值为null。列表框或下拉菜单对象。remove(index)或对象.options[index]=null
如//创建下拉菜单
var sel;
function create(){
//创建下拉菜单元素节点
sel=document.createElement("select");
//给sel属性节点赋值
sel.id="myselect";
sel.size=3;
//获取body元素节点
var body=document.getElementsByTagName("body")[0];
//将下拉菜单元素节点添加到body标签
body.appendChild(sel);
//创建选项节点
for(var i=0;i<5;i++){
//格式：选项节点=new option(文本节点，value属性节点)
var op=new Option("选项"+i,i);
//将选项添加到select标签
sel.appendChild(op);
}
}
如function del(){
//获取最后一个option元素的下标
var index=sel.options.length-1;
//删除最后一个元素；
sel.remove(index);
}
如//一次性清空option
function clear1(){
//让options的数组长度变为0;
sel.options.length=0;
}
DOM动态添加删除表格内容所用到的常用方法。
insertRow(index)在指定索引位置插入一行。
createCaption()为该表格创建标题。
deleteRow(index)删除表格中index索引处的行。
deleteCaption()删除表格标题
如//创建5行4列的表格
var table;
var body;
function create(){
//创建table元素节点
table=document.createElement("table");
//设置属性
table.border="1px";
//获取body元素节点
body=document.getElementsByTagName("body")[0];
//将table标签添加至body;
body.appendChild(table);
//循环插入行
for(var i=0;i<5;i++){
var tr=table.insertRow(i);
//插入4列
for(var j=0;j<4;j++){
var td=tr.insertCell(j);
//添加文本节点；
td.innerHTML=("第"+(i+1)+"行，第"+(j+i)+"列");
}
如//删除最后一行
function delrow(){
//盘旋table中是否还有tr
if(table.row.length>0){
//获取最后一行的下标
var index=table.rows.length-1;
//删除最后一行
table.deleteRow(index);
}else{
//所有行 都被删除，删除table标签
body.removeChild(table);
}
}
如//一列一列删除
function delCell(){
if(table.rows[table.rows.length-1].cells.length>0){
//获取最后一行tr的下标
var index=table.rows.length-1;
//获取最后一行的最后一列的下标
var index2=table.rows[index].cells.length-1;
//删除最后一列
table.rows[index].deleteCell(index2);
}else{
//删除最后一行
table.deleteRow(table.rows.length-1);
}
}
给表格行创建、删除单元格的方法。insertCell(index)在Index处创建一个单元格，返回新创建的单元格。deleteCell(index)删除某行在index索引处的单元格。
常见的时间类型ondblclick双击鼠标左键触发。onmousedown单击任意一个鼠标按键时触发。onmousemove鼠标移出一个元素边界时触发。onmousemove鼠标在某个元素上移动时持续触发。onmouseup松开鼠标任意一个按键时触发。onmouseover鼠标移到一个元素上是触发。
如<tittle>无标题文档</tittle>
<style>
#d1{
200px;
height:200px;
background:blue;
}
</style>
<script type="text/javascript">
function over (obj){
//当鼠标移上去变为红色
obj.style.background="red";
}
function out(obj){
//鼠标移走时变为蓝色
obj.style.background="blue";
}
</script>
</head>
<body>
<div id="d1" onMouseOver="over(this)" onMouseOut="out(this)"></div>
</body>
</html>
可以为元素添加多个事件。
this表示这个元素。