기본 JS는 GetElementsByClassName 메소드를 제공 하며이 메소드를 통해 지정된 클래스를 포함하는 노드 모음을 얻을 수 있습니다. 컬렉션, 즉이 함수는 배열을 반환합니다.
그러나 IE는이 방법을 지원하지 않지만이 방법은 매우 실용적이므로 IE에 대해 특별히 이러한 기능을 구현해야합니다.
코드 사본은 다음과 같습니다.
함수 getElementsByClassName (OELE, SCLASS, SELE) {
if (oele.getElementsByClassName) {
return oele.getElementsByClassName (sclass);
}또 다른{
var aele = oele.getElementsByTagName (sele || '*'),
reg = new regexp ( '(^| // s)'+sclass+'($ | // s)'),
arr = [],
i = 0,
ilen = aele.length;
for (; i <ilen; i ++) {
if (reg.test (aele [i] .className)) {
arr.push (aele [i]);
}
}
반환 ARR;
}
}
사용 방법 :
코드 사본은 다음과 같습니다.
// 첫 번째 유형 : 문서 아래의 모든 클래스를 box_box의 div 요소로 선택합니다.
getElementsByClassName (문서, 'box_box', 'div') [0] .style.background = '옐로우';
// 두 번째 유형 : 문서 아래의 모든 클래스를 Box-Box의 div 요소로 선택합니다.
getElementsByClassName (문서, 'box-box', 'div') [0] .Style.background = 'Yellow';
// 세 번째 유형 : 문서 아래의 모든 클래스를 박스 박스 요소로 선택합니다.
getElementsByClassName (Document, 'Box-Box') [0] .style.background = 'Yellow';
OELE 및 SCLASS가 필요하며 SELE는 선택 사항입니다.
Box-Box Box_box와 같은 SCLASS의 수평선 또는 밑줄에는 문제가 없습니다. 그러나 다른 특수 캐릭터라면 Box $ Box와 같은 문제가있을 가능성이 큽니다. 물론, 상자 // $ box와 같은 특수 캐릭터를 직접 얻기 위해 탈출구를 추가 할 수 있습니다 ...
호환성 : 테스트 IE6+
친구, 당신은 그것을 직접 사용한 후에 그것을 알게 될 것입니다. 사용하기 쉽습니다. 다른 친구들에게 전파합시다.