• 코드:
​x
 
1
<!DOCTYPE html>
2
<html lang="ko">
3
​
4
<head>
5
    <meta charset="UTF-8">
6
    <title>JavaScript DOM Element</title>
7
</head>
8
​
9
<body>
10
​
11
    <h1>클래스를 이용한 선택</h1>
12
    <ul>
13
        <li class="odd">첫 번째 아이템이에요!</li>
14
        <li>두 번째 아이템이에요!</li>
15
        <li class="odd">세 번째 아이템이에요!</li>
16
        <li>네 번째 아이템이에요!</li>
17
        <li class="odd">다섯 번째 아이템이에요!</li>
18
    </ul>
19
​
20
    <script>
21
        var selectedItem = document.getElementsByClassName("odd");  // 클래스가 "odd"인 모든 요소를 선택함.
22
        for (var i = 0; i < selectedItem.length; i++) {
23
            selectedItem.item(i).style.color = "red";           // 선택된 모든 요소의 텍스트 색상을 변경함.
24
        }
25
    </script>
26
    
27
</body>
28
​
29
</html>