Internet Explorer에서 클래스 이름으로 요소를 검색하는 방법은 무엇입니까?

getElementsByClassName() IE와의 호환성

질문: 특정 클래스가 있는 요소 배열을 효과적으로 검색하는 방법 , IE 호환성 제한을 고려하시나요?

답변:

Document.getElementsByClassName()은 IE에서 지원하지 않는 최신 방법입니다. 대신 다음 접근 방식을 고려하세요.

사용자 정의 함수(IE6):

getElementsByClassName()을 에뮬레이트하는 사용자 정의 함수를 정의합니다. 여기에는 DOM을 탐색하고 제공된 클래스 이름에 대해 요소의 클래스 이름을 테스트하는 작업이 포함됩니다.

<code class="js">function getElementsByClassName(node, className) {
    var a = [];
    var re = new RegExp('(^| )' + className + '( |$)');
    var els = node.getElementsByTagName('*');
    for (var i = 0, j = els.length; i < j; i++)
        if (re.test(els[i].className)) a.push(els[i]);
    return a;
}

// Usage:
var tabs = getElementsByClassName(document.body, 'tab');</code>

querySelectorAll (IE8 ):

IE8 이상을 지원하는 것으로 충분한 경우 , querySelectorAll():

<code class="js">if (!document.getElementsByClassName) {
    document.getElementsByClassName = function (className) {
        return this.querySelectorAll('.' + className);
    };
    Element.prototype.getElementsByClassName = document.getElementsByClassName;
}

// Usage:
var tabs = document.getElementsByClassName('tab');</code>

문서 메서드가 아니기 때문에 원하는 노드를 첫 번째 인수로 사용하여 getElementsByClassName()을 호출해야 합니다. 이러한 솔루션 중 하나를 구현하면 클래스 이름으로 요소를 검색할 수 있으므로 IE를 포함한 더 넓은 범위의 브라우저와의 호환성이 보장됩니다.

위 내용은 Internet Explorer에서 클래스 이름으로 요소를 검색하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!