부모, 자식, 형제 노드 탐색_CSS

miin·2023년 7월 28일
0

HTML / CSS

목록 보기
27/28
  • 부모(parent) 노드 탐색
    parentNode : 부모 노드를 리턴한다.
  • 자식(child) 노드 탐색
    childNodes : 자식 노드 목록을 NodeList 형태로 리턴한다
    firstChild : 자식 노드 중, 첫번째 자식 노드를 리턴한다
    lastChild : 자식 노드 중, 마지막 자식 노드를 리턴한다
  • 형제(sibling) 노드 탐색
    previousSibling : 같은 레벨의 노드 중, 이전 노드를 리턴한다
    nextSibling : 같은 레벨의 노드 중, 다음 노드를 리턴한다
let copyBtn = document.querySelectorAll('.action_btn_copy')

 copyBtn.forEach((item) => {
   item.addEventListener('click', function(event) {
    console.log('eee', event.target.previousSibling.previousSibling.innerText);
   })
 })

1개의 댓글

comment-user-thumbnail
2023년 7월 28일

유익한 글이었습니다.

답글 달기