●DOM:文档对象模型,代表整个HTML页面
▼获取窗口大小:
document.documentElement.clientWidth/clientHeight
○获取当前窗口宽/高,IE与DOM均可使用
document.body.clientWidth/clientHeight
○body对象宽/高
document.body.offsetWidth/Height
○视口(不是窗口,显示HTML页的区域)大小
▼获取节点:
IE某些节点只能通过name属性值获取,所以最好id与name都写出来,且值一样
注: 节点调用get方法,便相对定位于该节点,只在该节点上下查找相关节点
document.getElementByIdx("节点id");
○根据节点id获取节点,返回节点对象
document.getElementsByTagName_r("标签名");
○根据标签名,获取该标签表示的节点对象数组
doucment.getElementsByName("name属性值");
○根据name属性值,获取该值表示节点的对象数组.如radio单选框
附: radio的checked属性,选中返回true,否则false
▼节点属性: var
node=document.getElementByIdx("??");
node.nodeName
○节点标签名
如:HTML/BODY/DIV/#text(文本节点名)
node.nodeType
○节点类型
1(元素结点) 3(文本结点)
node.nodue
○节点文本内容
文本结点返回文本内容(文本内容是文本结点一个属性),元素结点返回null
node.属性名
○获取节点指定属性值
node.属性名="?";
○给节点指定属性重新赋值
node.getAttribute("属性名")/setAttribute("属性名","属性值")
○获取/重置属性值,但某些浏览器不支持,建议不用
node.parentNode
○获取父节点
node.childNodes
○获取子节点,返回子节点数组
node.childNodes[i]
○直接获取该节点下第i个子节点
node.firstChile/lastChild
○获取该节点下第1个/最后1个子节点
node.previousSibling/nextSibling
○获取同属一父节点下,该节点的上/下一节点
▼节点方法: var
ul=document.getElementByIdx("ul.id");
○以一个ul无序列表为例
var
li=document.createElement("标签名(如li)");
○创建一个指定标签类型的节点
var
te=documnet.createTextNode("文本内容");
○创建一个文本节点
ul.appendChild(li);
○在ul中追加一个li子节点
ul.insertBefore(li,ul.firstChild);
○在第2个参数指定节点前插入第1个参数表示的节点
var
_li=li.clone();
○克隆一个新节点.浅层克隆,不能克隆节点下面子节点,clone(true)则完全克隆
ul.removeChild(子节点);
○删除该节点下子节点,如果没有该子节点,则会报错
ul.hasChildNodes();
○判断该节点下是否存在子节点.存在返回ture,否则false
▼innerHTML:
MS提出的,所有浏览器支持,但IE的table,select不支持
node.innerHTML="html代码";
○向指定节点开闭标签内填入html代码,然后被执行
node.innerHTML+="html代码";
○若重复执行上面代码,会发生覆盖.+=则实现追加