JavaScript之DOM
学习的网站：
javascript初级教程 http://www.iselong.com/online/ebooks/javascript/
http://www.aspxboy.com/myjs/jsnote/
www.ajaxian.com
www.ajaxpatterns.org
www.ajaxmatters.com/r/welcome
www.ajaxblog.com
www.adaptivepath.com
DOM
的属性
childNodes
firstChild
lastChild
nextSibling
nodeValue
parentNode
previousSibling
DOM
方法
getElementById(id)
getElementByTagName(name)
hasChildNodes()
getAttribute(name)
For example DOM
window.onload=function(){
var hello=
document.getElementById('hello')
;
hello.className='declared';
var empty=document.getElementById('empty');
addNode(empty,"reader of");
addNode(empty,"Ajax in Action!");
var children=empty.childNodes;
for (var i=0;i<children.length;i++){
children[i].className='programmed';
}
empty.style.border='solid green 2px';
empty.style.width="200px";
}
function addNode(el,text){
var childEl=
document.createElement("div")
;
el.appendChild(childEl)
;
var txtNode=
document.createTextNode(text)
;
childEl.appendChild(txtNode);
}
For example
document.getElementsByTagName("UL")
For example
function addListItemUsingInnerHTML(el,text){
el.innerHTML+="<div class='programmed'>"+text+"</div>";
}
xmlhttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
特别要注意的地方：
1：
<table><tbody name=”myTableBody”></tbody></table>
Var cell = document.createElement(“td”).appendChild(document.createTextNode(“foo”));
Var row = document.createElemnet(“tr”).appendChild(cell);
Document.getElementById(“myTableBody”).appendChild(row);
2:
var spanElement = document.getElementById(“mySpan”);
spanElement.setAttribute(“style”,”font-weight:blod;color:red;”);
spanElement.style.cssText = “font-weight:blod;color:red;”;
3:
element.setAttribute(“class”,”styleclass”);
element.setAttribute(“className”,”styleclass”);
4:
var button = document.createElement(“input”);
button.setAttribute(“type”,”button”);
document.getElementById(“form1”).appendChild(button);