querySelectorAll이 누락된 경우 속성으로 요소를 선택하는 방법은 무엇입니까?

querySelectorAll을 사용할 수 없는 경우 속성별로 요소를 검색하는 방법

보편성에도 불구하고 querySelectorAll 메서드는 보편적으로 액세스하지 못할 수 있습니다. 예를 들어 IE7과 같은 오래된 브라우저에는 이 기능이 없습니다. 그러나 IE7과의 호환성을 보장하는 기본 접근 방식을 사용하면 유사한 결과를 얻을 수 있습니다.

다음 시나리오를 고려하십시오.

<p data-foo="bar"></p>

일반적으로 querySelectorAll을 사용하여 다음을 기반으로 요소를 검색합니다. 해당 속성은 다음과 같습니다.

document.querySelectorAll('[data-foo]')

그러나 querySelectorAll이 없으면 대체 솔루션이 필요합니다.

동일한 기능을 기본적으로 얻으려면 JavaScript 함수를 생성할 수 있습니다.

function getAllElementsWithAttribute(attribute) {
  var matchingElements = [];
  var allElements = document.getElementsByTagName('*');
  for (var i = 0, n = allElements.length; i < n; i++) {
    if (allElements[i].getAttribute(attribute) !== null) {
      matchingElements.push(allElements[i]);
    }
  }
  return matchingElements;
}

이 함수는 전체 문서를 탐색하여 특정 속성을 가진 모든 요소를 ​​검색합니다. 이를 호출하면

getAllElementsWithAttribute('data-foo');

"data-foo" 속성이 있는 요소를 효과적으로 검색할 수 있습니다. 이 솔루션은 포괄적이고 IE7과 호환되므로 querySelectorAll이 없는 브라우저에서도 속성별로 요소에 액세스할 수 있습니다.

위 내용은 querySelectorAll이 누락된 경우 속성으로 요소를 선택하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!