[JS] 19-HTML 탐색하기

부모요소

• .parentElement

조상요소

• .closest('#ID')
  • 상위 요소들 중에서 주어진 selector를 충족하는 가장 가까운 요소를 검색
  • -> IE는 지원하지 않음

자식요소

• children
  • chileren과 다르게 childNodes도 있음. (비추)

    • // 지정된 요소의 텍스트와 하위 Element를 모두 조회
      // -> 심지어는 코드 줄맞춤을 위한 줄바꿈도 텍스트로 인식
      console.log(document.querySelector("#list").childNodes);

자손요소

• document.querySelectorAll // 에서 document를
  
  const post1 = document.querySelector("#post1");
  post1.querySelectorAll(".thumb").forEach((v)=>{})~
  // document.대신 어떤 객체를 쓰면 그 자손 객체만 선택 가능하다.

형제요소

• previousElementSibling

  • e.currentTarget.parentElement.previousElementSibling.style.fontSize = size1 + "px";
    // 자신의 부모에 대한 '이전'요소의 style 변경