DOM常用操作
1、获取对象
document.getElementById(ID)
//获得指定ID值的对象
document.getElementsByName(Name)
//获得指定Name值的对象数组，常用获取radio,checkbox
2、坐标
var oRect=obj.getBoundingClientRect();
x=oRect.left
y=oRect.top
3、获取窗口大小,分辨率
document.body.clientWidth document.body.clientHeight 获得窗口大小（包含Border、Scroll等元素） document.body.offsetWidth document.body.offsetHeight分辨率creen.width,creen.height.具体解释如下：scrollWidth是对象的实际内容的宽，不包边线宽度，会随对象中内容的多少改变（内容多了可能会改变对象的实际宽度） clientWidth是对象可见的宽度，不包滚动条等边线，会随窗口的显示大小改变。offsetWidth是对象的可见宽度，包滚动条等边线，会随窗口的显示大小改变。scrollHeight: 获取对象的滚动高度。offsetHeight:获取对象相对于版面或由父坐标 scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离offsetLeft:获取对象相对于版面或由scrollTop:设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离offsetTop 属性指定的父坐标的计算顶端位置offsetParent 属性指定的父坐标的高度offsetParent 属性指定的父坐标的计算左侧位置event.clientX 相对文档的水平座标event.clientY 相对文档的垂直座标event.offsetX 相对容器的水平坐标event.offsetY 相对容器的垂直坐标document.documentElement.scrollTop 垂直方向滚动的值 event.clientX+document.documentElement.scrollTop 相对文档的水平座标+垂直方向滚动的量 以上主要指IE之中，FireFox差异如下：IE6.0、FF1.06+：clientWidth = width + padding clientHeight = height + paddingoffsetWidth = width + padding + borderoffsetHeight = height + padding + borderIE5.0/5.5：clientWidth = width - borderclientHeight = height - borderoffsetWidth = widthoffsetHeight = height 例：如页面过长，想让id="view1"的节点显示出来。var currentDom=document.getElementById("view1").getBoundingClientRect(); if(currentDom.top>window.document.body.clientHeight){ window.document.body.scrollTop=currentDom.top; }function domReady(func) { // 假如DOM已经加载，马上执行函数 if (domReady.done) return func(); // 假如我们已经增加了一个函数 if (domReady.timer) { // 把它加入到待执行函数清单中 domReady.ready.push(func); } else { // 为页面加载完毕绑定一个事件以防止它最先完成。使用addEvent函数 // addEvent函数为由Dean Edwards编写的著名函数 addEvent(window, "load", isDOMReady ); // 初始化待执行函数的数组 domReady.ready[ func ]; // 尽可能快地检查DOM是否已可用 domReady.timer = setInterval(isDOMReady, 13); }};//检查DOM是否已可操作function isDOMReady() { // 如果我们能判断出DOM已可用，忽略 if (domReady.done) return false; // 检查若干函数和元素是否可用 if (document && document.getElementsByTagName && document.getElementById && document.body) { // 如果可用，我们可以停止检查 clearInterval(douReady.timer); domReady.timer = null; // 执行所有正等待的函数 for (var i = 0; i < domReady.ready.length; i++) domReady.ready[i](); // 记录我们在此已经完成 domReady.ready = null; domReady.done = true; }}/*创建新层*/var div_view=document.createElement("div");也可这样创建 document.createElement("<div></div>");设置样式:div_view.className="";设置ID：div_view.id="div1";设置div显示内容：div_view.innerHTML="test";innerHTML即div里的内容。例<div id="div1">test1</div>,div1.innerHTML则是"test1"outerHTML则是整个div。例div1.outerHTMl是"<div id=div1>test1</div>".注意，innerHTML和outerHTML均会把",'去掉。/*创建table,插入行，列*/var table=document.createElement("table");var trow=table.insertRow();插入行到最后。var trow=table.insertRow(1);插入到第2行。var rowLength=table.rows.length;获取table的总行数var tcell=row.insertCell();插入一列tcell.innerHTML="insert row";设置列内容其他的创建方式类似。document.body.appendChild(div_view);把层添加到body中，这样才会在页面中显示增加的层。当前选中的option:select.options[select.selectedIndex]所有options:select.options.返回的是option[]数组增加option方法1：option1=new Option(text,value); select.add(option1);方法2：option2=document.createElement("option"); option2.value=value; option2.text=text; select.add(option2);删除option select.remove(option1);删除所有option select.options.length=0;