특히 IE 호환성을 위해 JavaScript에서 클래스별로 요소를 검색하려면 어떻게 해야 합니까?

IE 호환성을 포함하여 JavaScript에서 클래스별로 요소 검색

해당 클래스를 기반으로 요소 배열을 가져오는 것은 JavaScript에서 일반적인 작업입니다. 그러나 IE와 같이 document.getElementsByClassName()을 기본적으로 지원하지 않는 브라우저의 경우 대체 접근 방식이 필요합니다.

인기 있는 솔루션 중 하나는 Jonathan Snook의 기능입니다. 이 함수는 정규식을 사용하여 각 요소의 className 속성을 테스트합니다. 그러나 IE에서는 "개체가 이 속성이나 메서드를 지원하지 않습니다."라는 오류가 발생합니다.

중요한 것은 getElementsByClassName()이 문서 개체의 메서드가 아니라는 점을 인식하는 것입니다. 대신 요소를 검색하려는 노드에서 직접 호출해야 합니다.

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;
}

var tabs = getElementsByClassName(document.body, 'tab');

IE8의 경우 더 간결한 접근 방식은 getElementsByClassName() 함수를 폴리필하는 것입니다.

if (!document.getElementsByClassName) {
    document.getElementsByClassName = function (className) {
        return this.querySelectorAll("." + className);
    };
    Element.prototype.getElementsByClassName = document.getElementsByClassName;
}

var tabs = document.getElementsByClassName('tab');

이러한 기술을 사용하면 클래스별로 요소를 검색하여 IE 및 기타 브라우저와의 호환성을 보장할 수 있습니다.

위 내용은 특히 IE 호환성을 위해 JavaScript에서 클래스별로 요소를 검색하려면 어떻게 해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!