• 코드:
​x
 
1
<!DOCTYPE html>
2
<html lang="ko">
3
​
4
<head>
5
    <meta charset="UTF-8">
6
    <title>JavaScript Node Manage</title>
7
</head>
8
​
9
<body>
10
​
11
    <h1>속성 노드의 생성</h1>
12
    <p id="text">이 단락에 새로운 속성을 추가할 것입니다.</p>
13
    <button onclick="createNode()">속성 노드 생성!</button>
14
​
15
    <script>
16
        function createNode() {
17
            var text = document.getElementById("text");             // 아이디가 "text"인 요소를 선택함.
18
            var newAttribute = document.createAttribute("style");   // 새로운 style 속성 노드를 생성함.
19
            newAttribute.value = "color:red";
20
            text.setAttributeNode(newAttribute);                    // 해당 요소의 속성 노드로 추가함.
21
        }
22
    </script>
23
24
</body>
25
​
26
</html>