Ajax實戰：尋找DOM節點

用JavaScript操作DOM的第一件事就是找到要修改的元素。前面已經提到，我 們開始只能得到根節點的一個引用，它儲存在全域變數document中。DOM中的每 一個節點都是document的子節點(或孫節點、曾孫節點等等)，但是要在大型的複 雜文檔中，一步一步地緩慢搜尋是件體力活。幸運的是，我們可以走一些捷徑。 最常用的方法就是給元素附加唯一的ID。在代碼清單2-5的onload()函數中，我 們想要尋找兩個元素：段落元素，我們為它設定樣式;空的標籤，我們為它添加 內容。如你所見，已經在HTML中為它們附加了唯一的ID屬性，即：任何一個DOM 節點都可以分配一個ID，用來在程式中通過一個函數調用獲得這個節點的引用， 無論它在文檔中的什麼位置：

var hello=document.getElementById('hello');

注意，這是Document對象的一個方法。在一個如上所述的簡單情況中(以及在 很多複雜的情況中)，可以通過document訪問當前的Document對象。如果你使用 了IFrame(我們將會在後面討論)，那麼可能需要跟蹤多個Document對象，並確定 正在查詢的是哪個Document對象。

在一些情況下，我們確實需要一步一步地搜尋DOM樹。因為DOM節點是以樹形 結構來組織的，每一個DOM節點都只有不多於一個的父節點，但是可以有任意多 個子節點。可以通過parentNode和childNodes來訪問它們。parentNode返回另外 一個DOM節點，而childNodes返回一個JavaScript節點數組，可以對其遍曆，即 ：

var children=empty.childNodes;
for (var i=0;i< SPAN>
...
}

即便在文檔中的某個節點上沒有附加唯一ID，我們仍有第三種方法可以方便 地定位節點。那就是，使用getElementsByTagName()方法，基於HTML標籤的類型 搜尋DOM節點。例如，document.getElementsByTagName("UL")會返回 一個包含文檔中所有標籤的數組。

這些方法對於操作那些我們幾乎無法控制的文檔[2]來說是很有用的。作為通 常的規則，使用getElementById()要比使用getElementsByTagName()更加安全， 因為前者對於文檔結構和順序的假設更少一些，這樣文檔結構可以獨立於代碼而 變化。