JavaScript 요소에 특정 클래스가 포함되어 있는지 확실하게 확인하는 방법은 무엇입니까?

JavaScript에서 요소에 클래스가 포함되어 있는지 확인하는 방법

문제:

요소가 특정 클래스를 소유하고 있는지 확인하는 것은 JavaScript의 일반적인 요구 사항입니다. 그러나 제공된 예에서 설명한 것처럼 className 속성 비교에만 의존하면 요소에 여러 클래스가 포함된 경우 불안정해집니다.

해결책:

특정 클래스는 요소에 할당된 총 클래스 수에 관계없이 classList.contains를 활용합니다.

element.classList.contains(className);

이 방법은 최신 브라우저에서 완벽하게 작동하며 폴리필을 사용하여 이전 브라우저에 사용할 수 있습니다.

대체 접근 방식:

더 넓은 호환성을 위해 약간의 indexOf 사용을 고려하세요. 수정:

function hasClass(element, className) {
    return (' ' + element.className + ' ').indexOf(' ' + className+ ' ') > -1;
}

이 조정을 통해 부분적인 클래스 이름 일치로 인해 잘못된 결과가 발생하지 않습니다.

데모:

var test = document.getElementById("test"),
    classes = ['class1', 'class2', 'class3', 'class4'];

test.innerHTML = "";

for(var i = 0, j = classes.length; i < j; i++) {
    if(hasClass(test, classes[i])) {
        test.innerHTML = "I have " + classes[i];
        break;
    }
}

여기서 예를 들어, 코드는 다른 클래스가 동반되는 경우에도 요소 내에 있는 클래스를 효율적으로 식별하고 표시합니다.

위 내용은 JavaScript 요소에 특정 클래스가 포함되어 있는지 확실하게 확인하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!