DOM Method   DOM 메소드

1. DOM 노드 접근 메소드 

  ㅇ 노드 찾기/접근                                                       ☞ DOM 노드 접근 참조
     - getElementById(id), getElementsByTagName(tag), getElementsByClassName(class),
       getElementsByName(name)

  ㅇ 노드 워킹(walking) 또는 돌아다님(traverse)
     - 메소드 이용 방법
        . Element.closest(selector) : 가장 근접한 상위 요소 1개 만 반환
     - 프로퍼티 이용 방법  ☞ DOM 프로퍼티 (3.항) 참조

  ㅇ 노드의 속성(attribute) 접근,변경
     - 속성 읽기/접근 : getAttribute(속성이름)
     - 속성 추가/변경 : setAttribute(속성이름,속성값)


2. DOM 노드 조작(생성/추가/제거/교체/복사) 메소드 

  ㅇ 노드 생성
     - 요소 노드 생성 :  createElement(tag)
     - 텍스트 노드 생성 :  createTextNode(text)
     - 속성 노드 생성 :  createAttribute(attr)
     - 주석 노드 생성 :  createComment(text)

     * 생성 例) var element = document.createElemet('tag명');

     * 한편, 노드 생성은, 단지 생성 만 된 것이고, 실제 DOM 트리에 적용하기 전임

  ㅇ 노드 추가    
     - 마지막 자식 노드 추가 :  var new = appendChild(new)
     - 지정 자식 노드 바로 앞에 추가 :  var insertedNode = insertBefore(new, old)

     * 실험적인 메소드들
        . ParentNode.prepend() : 부모 노드 ParentNode의 처음 자식 노드로 추가
        . ParentNode.append() : 부모 노드 ParentNode의 마지막 자식 노드로 추가
     
  ㅇ 노드 제거                                                 ☞ MDN removeChild 참조
     - 자식 노드 제거 :  removeChild(child)

  ㅇ 노드 교체 :  replaceChild(new,old)

  ㅇ 노드 복사 :  cloneNode()

  ㅇ 자식 노드 유무
     - element.hasChildNodes()

     * property로 확인하는 경우
     - if (element.firstChild)
     - if (element.firstElementChild)
     - if (element.childNodes.length > 0)
     - if (element.children.length > 0)


3. DOM 기타 메소드

  ㅇ 웹문서에 쓰기 (document 객체에 소속된 유용한 메소드)
     - write() : 문자열을 전달 받아 웹문서에 쓰기
     - writeln() : write() 뒤에 줄바꿈 문자를 추가

  ㅇ form 요소 관련 메소드
     - submit(), reset()
     - focus(), blur()
     - select()