문서의 계통도에서 노드(node)로서의 택스트 문자열을 참조한다.

Script [propVal=]..propName;
HTML 없다.
특기

TextNode 개체는 createTextNode 메서드를 사용하여 생성한다. TextNode 개체가 생성된 뒤에는 appendChild, replaceNodeinsertBefore 메서드를 사용하여 추가하거나 수정할 수 있다.

이 개체는 IE5 이상에서 스크립트를 사용할 수 있다.

참조

이 개체는 (영문)HTML3.2에서 정의되었다.


설명을 위한 예제

  1. 항목 1
  2. 항목 2
  3. 항목 3
  4. 항목 4

data 속성 IE
개체의 값을 반환하거나 설정한다.
문법: .data[=vVal]
코드: document.write(oObj.data) 결과:
length 속성 IE
개체의 글자수 길이를 반환한다.
문법: [iVal=].length
코드: document.write(oObj.length) 결과:
nextSibling 속성 IE
의 모체 개체의 다음 자식 개체을 반환한다.
문법: [oVal=].nextSibling
코드: document.write(oObj.nextSibling) 결과:
코드: if (oObj.nextSibling) document.write(oObj.nextSibling.innerText) 결과:
nodeName 속성 IE
개체의 노드(node) 형식을 반환한다.
문법: [sVal=].nodeName
코드: document.write(oObj.nodeName) 결과:
nodeType 속성 IE
개체의 요청된 노드(node)의 형식을 반환한다.
문법: [iVal=].nodeType
코드: document.write(oObj.nodeType) 결과:
nodeValue 속성 IE
개체의 노드(node)값을 반환하거나 설정한다.
문법: .nodeValue[=sVal]
코드: document.write(oObj.nodeValue) 결과:
parentNode 속성 IE
⇒ 문서의 계통도상 개체의 모체 개체를 반환한다.
문법: [oVal=].parentNode
코드: document.write(oObj.parentNode) 결과:
코드: document.write(oObj.parentNode.nodeName) 결과:
previousSibling 속성 IE
⇒ 문서의 계통도상 개체의 모체에 소속된 다음 형제 개체를 반환한다.
문법: [Val=].previousSibling
코드: document.write(o1Obj.previousSibling) 결과:
코드: if (o1Obj.previousSibling) document.write(o1Obj.previousSibling.nodeName) 결과:

메서드설명
appendData IE6 개체에 새로운 글자 문자열을 추가한다.
deleteData IE6 개체에서 지정된 글자들을 제거한다.
insertData IE6 개체에서 지정된 글자들을 삽입한다.
replaceData IE6 개체에서 지정된 글자들의 범위를 새로운 문자열로 교체한다.
splitText 지정한 색인(index)에서의 문자열 노드를 분리한다.
substringData IE6 개체로부터 지정된 글자들의 범위를 추출한다.

개체 예제

항목 제목 1
항목 내용 1
항목 제목 2
항목 내용 2
항목 제목 3
항목 내용 3
결과 표시창

항목이나 제목을 클릭하면 값이 바뀐다.

<STYLE>dl.samp dt, dl.samp dd{border:solid 1 blue;padding;3;background:ffc}</STYLE>
<SCRIPT>
function doChanget(obj){
  TextNodeObj=document.createTextNode('새로운 데이터');
  obj.firstChild.replaceNode(TextNodeObj);
  showA.innerHTML='<'+obj.nodeName+' id='+obj.id+'>  nodeValue='+obj.firstChild.nodeValue;
}
</SCRIPT>
<DL id=dlObj class=samp>
<DT id=dt1 onclick='doChanget(this)'>항목  제목 1
<DD id=dd1 onclick='doChanget(this)'>항목 내용 1
<DT id=dt2 onclick='doChanget(this)'>항목  제목 2
<DD id=dd2 onclick='doChanget(this)'>항목 내용 2
<DT id=dt3 onclick='doChanget(this)'>항목  제목 3
<DD id=dd3 onclick='doChanget(this)'>항목  내용 3
</DL>
<BUTTON onclick="doChanget(dlObj.firstChild);this.disabled=true">첫 항목 제목을 변경시킨다.</BUTTON>
<DIV id=showA>결과 표시창</DIV>