如何在 JavaScript 中檢索具有相同 ID 的多個元素？

在JavaScript 中管理具有相同ID 的多個元素

在JavaScript 中，getElementById 是一種用於根據元素的ID 屬性檢索元素的方法。但是，當多個元素具有相同的 ID 時會發生什麼？

問題陳述：

我們如何使用 getElementById 擷取具有相同 ID 屬性的元素集合？

討論與解決方案：

雖然不建議在一個網頁內使用多個相同的 ID，可能會出現這種情況。為了解決這個問題，我們可以採用解決方法：

一種方法是使用 querySelectorAll，它傳回與指定選擇器相符的元素集合。以下是一個範例：

var elms = document.querySelectorAll("[id='duplicateID']");

// Access and modify the elements as needed...

透過使用帶有方括號的 CSS 選擇器，我們可以檢索具有指定 ID 值的所有元素，即使它出現多次。

或者，如果我們必須專門使用getElementById，我們可以透過元素的ID 值迭代地檢索元素並將它們添加到array:

var elms = [];
var id = "duplicateID";

// Loop through all elements with the specified ID...
while (document.getElementById(id)) {
  // Add the element to the array...
  elms.push(document.getElementById(id));

  // Increment the id to avoid duplicates...
  id += "_duplicate";
}

// Access and modify the array of elements...

透過在每次迭代中遞增ID值，我們有效地創建了可以使用getElementById 存取的唯一ID。

請記住，使用多個相同的 ID 可能會導致意外行為，通常不建議這樣做。但是，這些解決方法在處理現有程式碼庫或使用第三方 HTML 文件時可能會有所幫助。

以上是如何在 JavaScript 中檢索具有相同 ID 的多個元素？的詳細內容。更多資訊請關注PHP中文網其他相關文章！