• 코드:
​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>DOM 요소의 스타일 변경</h1>
12
    <p id="text">이 문자열의 기본색은 검정색입니다!</p>
13
    <button onclick="changeRedColor()">빨간색 글자!</button>
14
    <button onclick="changeBlackColor()">검정색 글자!</button>
15
16
    <script>
17
        var str = document.getElementById("text");  // 아이디가 "str"인 요소를 선택함.
18
        function changeRedColor() {
19
            str.style.color = "red";                // 해당 요소의 글자색을 빨간색으로 변경함.
20
        }
21
        function changeBlackColor() {
22
            str.style.color = "black";              // 해당 요소의 글자색을 검정색으로 변경함.
23
        }
24
    </script>
25
26
</body>
27
​
28
</html>