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 값으로 요소를 반복적으로 검색하여 요소에 추가할 수 있습니다. 배열:

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 중국어 웹사이트의 기타 관련 기사를 참조하세요!