javascript獲取元素的3種方法實例詳解

getElementById

DOM提供了一個名為getElementById的方法，這個方法將返回一個與之對應(yīng)id屬性的節(jié)點對象。使用的時候請注意區(qū)分大小寫。

它是document對象特有的函數(shù)，只能通過其來調(diào)用該方法。其使用的方法如下：

該方法兼容主流瀏覽器，甚至包括IE6+，可以大膽使用。

getElementsByTagName

該方法返回一個對象數(shù)組（準確的說是HTMLCollection集合，它不是真正意義上的數(shù)組），每個對象分別對應(yīng)著文檔里有著給定標簽的一個元素。類似于getElementById,同樣，該方法只提供一個參數(shù)，它的參數(shù)是指定標簽的名字，示例代碼如下：

需要注意的是，該方法除了能被document對象調(diào)用之外，還可以被普通的元素調(diào)用。示例如下：

原生DOM的話首先獲取標簽對象，id或者name或其他

例：

jQuery獲取

如果已經(jīng)獲取到對象可以直接獲取標記名

同樣，該方法兼容主流瀏覽器，甚至包括IE6+，可以大膽使用。

getElementsByClassName

除了通過指定標簽獲取元素外，DOM還提供了getElementsByClassName方法來獲取指定class名的元素。不過由于該方法比較新，較老的瀏覽器還不支持，比如IE6。不過我們可以通過hack方式來彌補老瀏覽器缺陷。該方法調(diào)用的方式如下所示：

和getElementsByTagname一樣， 該方法除了能被document對象調(diào)用之外，還可以被普通的元素調(diào)用。

對于比較老的瀏覽器，比如IE6、7我們可以通過下面的hack方式來實現(xiàn)：

如果你不僅僅滿足上面那些元素選擇的方法，想和JQuery一樣，能通過選擇器來獲取元素，實現(xiàn)的方法和上面的getElementsByClassName差不多，如果有興趣自己可以實現(xiàn)一套選擇器。不過我覺得有上面的三個方法再結(jié)合事件冒泡，已經(jīng)夠用了，畢竟這三種性能上算是優(yōu)秀的。

聲明：本網(wǎng)頁內(nèi)容旨在傳播知識，若有侵權(quán)等問題請及時與本網(wǎng)聯(lián)系，我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com