獲取 javascript 中特定 DOM 元素組的內容列表的最佳方法是什么？

Question

基本場景：我在 HTML 頁面上有一系列動態生成的元素。 （目前，它們都是divs ，但它們不需要。）

我想要的是一個 javascript function 它將遍歷所有這些divs （或其他）以尋找特定值的存在。

最好、最跨瀏覽器的方法是什么？ getElementsByName() 是否適用於所有瀏覽器中的divs ？ 我可以給他們所有相同的 ID 並以某種方式從 getElementById 中獲取一個數組嗎？

如果我將這些divs更改為spans或inputs ，這會讓事情變得更容易嗎？

謝謝！

（編輯：最好，對於這個項目，如果有一個不使用任何外部 js 庫的解決方案。我假設 jQuery 有一個 function 可以在一行中執行此操作，但目前我想避免打開它一罐蠕蟲與客戶端。）

Answer 1

getElementsByTagName是在 DOM Core 中定義的，因此任何實現它的瀏覽器都可以工作。 這就是當前使用的所有瀏覽器。

看看這里的細節： http://www.quirksmode.org/dom/w3c_core.html

需要注意的一個問題是getElementsByTagName返回一個NodeList - 而不是一個數組。 它的工作原理是一樣的，但它的評估很晚，所以如果你在遍歷NodeList時向 DOM 添加/刪除節點，你會得到奇怪的結果。 在這些情況下，編寫兩個循環； 首先循環遍歷NodeList並將所有條目存儲在數組中 - 然后循環遍歷數組。

Answer 2

元素是什么並不重要，重要的是它們在頁面中的位置。 如果它們都是單個父元素的子元素，那么您的問題很簡單。 給父元素一個 ID，你可以使用getElementById()來獲取它並迭代它的子元素。

當在文檔中找到多個 ID 實例時， getElementById()行為未定義。 大多數會返回他們能找到的第一個元素，但你當然不能指望得到一個數組。

getElementsByTagName()僅當您可以使用一些您確定不會出現在頁面其他位置的晦澀標簽時才有效。 您可以通過指定您感興趣的元素將具有您可以檢查的屬性（例如@class 或@title）來擴充它。 然后，您可以循環檢查getElementsByTagName()的結果並僅查看存在該屬性的元素。

Answer 3

您可以使用此站點查看 getElementBy 最適合您的需求。
有一些使用庫和一些像troelskn寫的，在所有支持的瀏覽器中都適用於標准 javascript。