First div element with class="example".
Second div element with class="example".
Click the button to change the text of the first div element with class="example" (index 0).
Note: The getElementsByClassName() method is not supported in Internet Explorer 8 and eralier versions.
=====Definition and Usage=====
%%getElementsByClassName()%% 메서드는 지정된 클래스 이름을 가진 문서의 모든 요소 컬렉션을 %%HTMLCollection%% 오브젝트로 반환합니다.\\
\\
%%HTMLCollection%% 오브젝트는 __노드 컬렉션__a collection of nodes을 나타냅니다.\\
노드는 인덱스 번호로 액세스할 수 있습니다. 인덱스는 0에서 시작합니다.\\
\\
**Tip:**\\
%%HTMLCollection%% 개체의 길이 속성을 사용하여 지정된 클래스 이름을 가진 요소의 수를 확인한 다음\\
모든 요소를 반복하고 원하는 정보를 추출할 수 있습니다.\\
=====Syntax=====
document.getElementsByClassName(classname)
=====Parameter Values=====
| Parameter | Type | Description |
^ classname ^ String ^ 필수이며, 가져오려는 요소들의 클래스 이름입니다. ^
^ ::: ^ ::: ^ 여러 개의 클래스 이름을 검색하려면, "test demo"처럼 공백으로 구분합니다. ^
=====Technical Details=====
반환 값:\\
반환하는 값은 %%HTMLCollection%% 오브젝트이며, 지정된 클래스 이름을 가진 요소 컬렉션을 나타냅니다.\\
반환된 컬렉션의 요소들은 소스 코드에서 보여지는 대로 정렬됩니다.\\
====예제====
"example" 클래스와 "color" 클래스를 모두 가진 요소들을 모두 가져옵니다.\\
P element in first div with class="example". Div's index is 0.
P element in first div wikth class="example color". Div's index is 0.
P element in second div with class="example color". Div's index is 1.
Click the button to change the background color of the first div element with the classes "exmaple" and "color".
Note: The getElementsByClassName() method is not supported in Internet Explorer 8 and earlier version.
====예제====
%%HTMLCollection%% 오브젝트의 length 속성을 사용하여, 문서에 %%class="example"%%이 있는 요소가 몇 개 있는지 확인합니다.\\
A div element with class="example"
Another div element with class="example"
A p element with class="example"
Click the button to find out how many elements with class "exmple" there are in this document.
Note:The getElementsByClassName() method is not supported in Internet Explorer 8 and earlier versions.
====예제====
%%class="example"%%을 가진 모든 요소들의 배경색을 변경합니다.\\
A div with class="example"
Another div with class="example"
This is a p element with class="example".
This is a span element with class="example" inside another p element.
Click the button to change the background color of all elements with class="example"
Note:The getElementsByClassName() method is not supported in Internet Explorer 8 and eralier versions.
\\
\\
{{tag>오션 HTML DOM getElementsByClassName() Method}}