一、DOM对象控制HTML

1.方法：

getElementsByName()  获取name

getElementsByTagName()  获取元素

getAttribute()  获取元素属性

setAttribute()  设置元素属性

childNodes()  访问子节点

parentNode()  访问父节点

createElement()  创建元素节点

createTextNode()  创建文本节点

insertBefore()  插入节点

removeChild()  删除节点

offsetHeight()  网页尺寸

scrollHeight()  网页尺寸html>

Hello

Hello

Hello

Hello

Hello

aid2

• 1
• 2
• 3

function getName(){

var count = document.getElementsByTagName("p");

alert(count.length);

var p = count[0];

p.innerHTML = "World";

}

function getAttr(){

var anode = document.getElementById("aid");

var attr = anode.getAttribute("title");

alert(attr);

}

function setAttr(){

var anode = document.getElementById("aid2");

anode.setAttribute("title","动态设置a的title属性");

var attr = anode.getAttribute("title");

alert(attr);

}

function getChildNode(){

var childnode = document.getElementsByTagName("ul")[0].childNodes;

alert(childnode.length);

alert(childnode[0].nodeType);

alert(childnode[1].nodeType);

}

function getParentNode(){

var div = document.getElementById("pid");

alert(div.parentNode.nodeName);

}

function createNode(){

var body = document.body;

var input = document.createElement("input");

input.type = "button";

input.value = "按钮";

body.appendChild(input);

}

function addNode(){

var div = document.getElementById("div");

var node = document.getElementById("pid");

var newNode = document.createElement("p");

newNode.innerHTML = "动态添加第一个p元素";

div.insertBefore(newNode,node);

}

function removeNode(){

var div = document.getElementById("div");

var p = div.removeChild(div.childNodes[1]);

}

function getSize(){

var width = document.body.offsetWidth||document.documentElement.offsetWidth;

var height = document.body.offsetHeight||document.documentElement.offsetHeight;

alert(width+","+height);

}

getSize();