ajax 之 dom 對象

1、getElementById(id)

通過元素的ID訪問元素，這是DOM一個基礎的訪問頁面元素的方法，我們要經常用到它.

例如下面的例子，我們可以同DIV的ID迅速的訪問到它，而不必通過DOM層層遍曆，

h

Just for testing;

Just for testing;

注意使用這個函數時如果元素的ID不是唯一的，那麼會獲得第一個合格元素。
在IE6中如果input、checkbox,radio. 等元素name匹配指定的ID，也會被訪問到
例如下面的例子中，獲得的元素是input：

Just for testing;

2、getElementsByName(name)
返回名字是name的元素數組，在IE6中元素ID匹配這個名字的話，這個元素也將包括在內，而且getElementsByName()僅用於象input,radio,checkbox等元素對象。
象下面例子中georges數組的長度應該是0。

ff

3、getElementsByTagName(tagname)
getElementByTagName可以用於DOCUMENT也可以用元素。getElementsByTagName返回具有指定tagname的子項目列表（數組）。你可以遍曆這個數組獲得每一個單獨的子項目。當處理很大的DOM結構，使用這種方法可以很容易的所有縮小範圍。

hi

hello

DOM Element 常用方法
1、appendChild(node)
向當前節點對象的追加節點。經常用於給頁面動態新增內容。

例如下面給div添加一個文本節點：

上面的例子中給DIV添加文本，也可以用newdiv.innerHTML=”A new div”實現，

不過innerHTML不屬於DOM

2、removeChild(childreference)
移除當前節點的子節點，返回被移除的節點。這個被移除的節點可以被插入document樹中別的地方

A child

3、cloneNode(deepBoolean)

複製並返回當前節點的複製節點，這個複製得到的節點是一個孤立的節點，不在document樹中。複製原來節點的屬性值，包括ID屬性，所以在把這個新節點加到document之前，一定要修改ID屬性，以便使它保持唯一。當然如果ID的唯一性不重要可以不做處理。

這個方法支援一個布爾參數，當deepBoolean設定true時，複製 當前節點的所有子節點，包括該節點內的文本。

11111

p=document.getElementById("mypara")

pclone = p.cloneNode(true);

p.parentNode.appendChild(pclone);

4、replaceChild(newChild, oldChild)
把當前節點的一個子節點換成另一個節點
例如：

span

5、insertBefore(newElement, targetElement)
給當前節點插入一個新節點，如果targetElement被設定為null，那新節點被當作最後一個子節點插入，否則那新節點應該被插入targetElement之前的最近位置。

熊掌我所欲也!

6、click()
執行元素的一次點擊，可以用於通過指令碼來觸發onClick函數

hhh

DOM Element的屬性:（下面是常用的。IE5.0以上,mozllia都支援的）

1、childeNodes 返回所有子節點對象,

例如

一個和尚有水喝。

兩個和尚挑水喝。

三個和尚沒水喝。

2、innerHTML
這是一個事實上的標準，不屬於w3c DOM，但是幾乎所有支援DOM的瀏覽器，都支援這個屬性。通過這個屬性我們很容易修改一個元素的HTML。

新人類，什嗎？！

3、style
返回一個元素的style對象的引用，通過它我們可以獲得並修改每個單獨的樣式。

例如下面的指令碼可以修改一個元素的背景色

document.getElementById("test").style.backgroundColor="yellow"

4、firstChild 返回第一個子節點
5、lastChild 返回最後一個子節點
6、parentNode 返回父節點的對象。
7、nextSibling 返回下一個兄弟節點的對象
8、previousSibling 返回前一個兄弟節點的對象
9、nodeName 返回節點的HTML標記名稱，使用英文的大寫字母，如P, FONT

例如

ddd

第一個例子：
使用DOM1.0 的javascript動態地建立一個HTML table。