DOM 기본 메소드_기본 지식

노드
1.document.getElementById(id);
에 대한 직접 참조--문서에서 ID로 노드 찾기
2.document.getElementByTagName(tagName)--배열 반환 , 이러한 노드에 대한 참조 포함
--예: document.getElementByTagName("span");은 범위 유형

의 모든 노드를 반환합니다. 2. 노드에 대한 간접 참조
3.
--요소의 모든 하위 노드를 반환합니다. element.childNodes[i]를 사용하여
--element.firstChild=element.childNodes[0];
--element .lastChild=element를 호출할 수 있습니다. childNodes[element.childNonts.length-1];
4.element.parentNode
--상위 노드 참조
5.element.nextSibling //다음 형제 노드 참조
element.previousSibling ; //이전 형제 노드 참조

3. 노드 정보 얻기
6. nodeName 속성은 노드 이름
을 얻습니다. 즉, 요소 ​​노드의 경우 다음과 같은 태그 이름이 반환됩니다. 🎜>
는 "a"를 반환합니다. --속성 노드의 경우 다음과 같이 속성 이름을 반환합니다. class="test"는 테스트를 반환합니다. --텍스트의 경우 노드는 텍스트의 내용을 반환합니다.
7.nodeType은 노드 유형을 반환합니다.
--요소 노드는 1을 반환합니다.
--속성 노드는 2를 반환합니다.
-텍스트 노드는 3을 반환합니다.
8.nodeValue는 노드의 값을 반환합니다.
--요소 노드는 null을 반환합니다.
--속성 노드는 정의되지 않은 값을 반환합니다.
--텍스트 노드는 텍스트 콘텐츠를 반환합니다.
9.hasChildNodes() 판단 하위 노드가 있는지 여부
10. tagName 속성은 반환합니다.
요소의 태그 이름 - 이 속성은 요소 노드에만 사용할 수 있으며

요소 노드의 nodeName 속성과 동일합니다. 4. 프로세스 속성은 Point
11을 구조화합니다. 요소 노드의 속성이며 (요소 node.attribute 이름)
12을 통해 액세스할 수 있습니다. setAttribute() 메서드를 사용하여 요소 노드
에 속성을 추가합니다. --elementNode.setAttribute(attributeName,attributeValue) ;
--attributeName은 속성의 이름이고, attributeValue는 속성의 값입니다
13. 속성 값을 얻으려면 getAttribute() 메서드를 사용하세요.
--elementNode.getAttribute(attributeName ; Spaces, 개행, 탭 등은 텍스트 노드로 처리됩니다. 일반적으로 element.childNodes[i]를 통해 참조되는 모든 텍스트 노드는 처리되어야 합니다.



6. 문서의 계층 구조를 변경합니다.
15.document.createElement() 메소드 요소 노드 생성
--예: document.createElement("Span");
16.document.createTextNode() 메소드는 텍스트 노드를 생성합니다
--예: document.createTextNode(" ") ; //참고: HTML을 통해 인코딩되지 않습니다. 즉, 여기서 생성되는 것은 공백이 아니라 문자열
17입니다. 노드를 추가하려면
-parentElement.appendChild를 사용하세요. (childElement);
18. insertBefore() 메서드를 사용하여 하위 노드를 삽입합니다.
--parentNode.insertBefore(newNode, referenceNode)
--newNode는 삽입된 노드입니다.
19. replacementChild 메서드를 사용하여 하위 노드 교체
--parentNode.replaceChild(newNode,oldNode)
-참고: oldNode는 parentNode의 하위 노드여야 합니다.
20. 노드
를 복사하는 cloneNode 메소드--node.cloneNode(includeChildren)
--includeChildren은 하위 노드를 복사할지 여부를 나타내는 부울입니다.
21.removeChild 메소드를 사용하여 하위 노드를 삭제합니다. >--parentNode.removeChild(childNode ; =document.createElement("table"); //테이블 생성
table.insertRow(i); //테이블의 i행에 행 삽입
row.insertCell(i ); // i번째 위치에 행 삽입
23. 참조 셀 객체
--table.rows[i].cells[i]24. >--table.deleteRow(index);
--row.deleteCell(index);
25. 두 ​​행을 교환하여 두 셀의 위치를 ​​얻습니다.
node1.swapNode(node2); --이 방법은 Firefox에서 사용할 수 있습니다.
일반 방법:
function swapNode(node1,node2)
{
var _parent=node1.parentNode
var _t1=node1; .nextSubling;
var _t2=node2 .nextSubling;
if(_t1)parent.insertBefore(node2,_t1)
else _parent.appendChild(node2); (node1,_t2);
else _parent.appendChild(node1);
}


모든 빈 노드 삭제:


nodetype=3 text s는 모든 공백과 일치합니다.
지정된 인덱스 위치에 노드를 삽입합니다.
function insertAt(parentNode,newNode,index)
{
if(!parentNode.hasChildNodes())
{
parentNode.appendChild(newNode);
return newNode;
}
//인덱스가 존재하지 않는 경우 예외 포착을 사용하세요.
try{
parentNode.insertBefore(newNode,parentNode. childNodes[index]);
}
catch(e){
return null;
}
return newNode;