createElement
/*
creatElement메소드는 특정 태그내에 포함된 새로운 요소 노드를 만들때 사용
이 메소드는 새로 만들어진 요소를 반환
만들려고 하는 태그명을 인수로 가짐.
*/
//구문
reference= document.createElement(element);
//예제
reference = document.createElement("p");
reference = document.createElement("h1");
/*
createElement에서 반환된 reference 는 노드 객체
이는 요소 노드이기 때문엔 nodeType프로퍼티 값은1
*/
/*
새로 만들어진 요소는 바로 문서내에 추가할수 있는것이 아니다
새노드가 parentNode 프로퍼티를 가지고있지 않기때문
자바스크립트에서 사용가능한 문서조각 형태로만 존재
문서에 추가는 appendChild, insertBefore, replaceChild등을 사용
*/
var para=document.createElement("p");
document.body.appendChild(para);
// 문서에 추가하기 전에 요소에 속성을 부여할수도있다
var para = document.createElement("p");
para.setAttribute("title", "단란내용");
document.body.appendChild(para);
// 문서에 추가된 후에도 요소의 속성을 바꿀수있다.
var para = document.createElement("p");
document.body.appendChild(para);
para.setAttribute("title", "단란내용");
createTextNode
/*
createTextNode메소드는 특정 텍스트를 포함하는 새 텍스트 노드를 만든다
메소드는 새로 만들어진 텍스트 노드를 반환
*/
//구문
reference = document.createTextNode(txt);
//예제
reference = document.createTextNode("안녕 길동아!");
//createTextNode에서 반환되는 것은 텍스트 노드 객체 이므로 nodeType =3 이다.
var message = document.createTextNode("열심히 아자자!");
//alert(message.nodeType); 3을 반환
var container = document.getElementById("intro");
container.appendChild(message);