캡슐화된 getElementsByClassName method_javascript 기술을 권장합니다.

우리는 네이티브 JS가 지정된 클래스를 포함하는 노드 컬렉션을 얻을 수 있는 getElementsByClassName 메서드를 제공한다는 것을 알고 있습니다. 즉, 이 함수는 배열을 반환합니다.

그러나 IE는 이 방법을 지원하지 않지만 이 방법은 매우 실용적이므로 IE 전용으로 이러한 기능을 구현해야 합니다.

코드 복사 코드는 다음과 같습니다.

함수 getElementsByClassName(oEle,sClass,sEle){
if(oEle.getElementsByClassName){
oEle.getElementsByClassName(sClass);
반환 }그밖에{
var aEle=oEle.getElementsByTagName(sEle || '*'),
reg=new RegExp('(^|\s)' sClass '($|\s)'),
도착=[],
나는=0,
iLen=aEle.length;

for(; i If(reg.test(aEle[i].className)){
arr.push(aEle[i]);
}
}
반납 도착;
}
}

사용방법:

코드 복사 코드는 다음과 같습니다.

//첫 번째 방법: 문서
아래에서 box_box 클래스가 있는 모든 div 요소를 선택합니다. getElementsByClassName(document,'box_box','div')[0].style.Background='yellow';

//두 번째 옵션: 문서 아래에 box-box 클래스가 있는 모든 div 요소를 선택합니다.
getElementsByClassName(document,'box-box','div')[0].style.Background='yellow';

//세 번째 방법: 문서 아래의 모든 클래스를 박스-박스 요소로 선택
getElementsByClassName(document,'box-box')[0].style.Background='yellow';

oEle 및 sClass는 필수이고 sEle은 선택 사항입니다.

sClass의 가로선이나 밑줄에는 문제가 없습니다. 예: box-box box_box; 그러나 다른 특수 문자인 경우 다음과 같이 문제가 있을 수 있습니다. box$box... 물론 가능합니다. 직접 추가하세요. box\$box…

와 같은 특수 문자를 사용자 정의하세요.

호환성: IE6 개인 테스트

친구 여러분, 직접 사용해보면 알게 될 것입니다. 사용하기 매우 쉽습니다. 다른 친구들에게도 널리 알려주세요.