티스토리 뷰

[개발]프로그래밍/javascript

[javascript] 문서 객체 - 객체 생성

좋은 블로그 2016. 10. 21. 07:58

1. 객체 생성() - 역할

요소를 활용하여 객체 생성


2. 객체 생성() - 메서드

메서드

설명

createElement()

요소 노드를 생성

createTextNode() 

텍스트 노드를 생성

appendChild()

객체에 노드를 연결


3. 객체 생성() - 예제

◈ 코드


1
2
3
4
5
6
7
8
9
10
11
12
<script>
window.onload = function(){
    var v_h1 = document.createElement('h1');
    var v_h1_text = document.createTextNode('test1');
    
    v_h1.appendChild(v_h1_text);
    document.body.appendChild(v_h1);
};
</script>
 
<body>
</body>






◈ 결과화면



◈ 설명

v_h1 변수로 요소 노드를 생성후 v_h1_text에 텍스트 노드를 생성하여 body에 노드를 연결시킵니다


◈ 결과코드

1
2
3
<body>
<h1>test1</h1>
</body>









'[개발]프로그래밍 > javascript' 카테고리의 다른 글

[javascript] getElementById - 문서 객체 가져오기  (0) 2016.10.21
[javascript] innerHTML - 문서 객체 생성  (0) 2016.10.21
[javascript] location - 주소 표시 관련 객체  (0) 2016.10.19
[javascript] screen - 운영체제 화면의 속성  (0) 2016.10.19
[javascript] open() - 새로운 원도 생성  (0) 2016.10.19
댓글
공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday