제수기 - 제발 수업내용을 기억해라

Traverse DOM

DOM은 Node로 구성되어 있다.

• • TextNode
• • CommentNode
• • ElementNode (태그객체)

Child Node 살펴보기

• 개행도 포함해서 본다
  

공식 문서 Node | Element

Node Docs
Element Docs

DOM Traversing

특정 태그로부터 DOM Tree를 탐색하는 방법
Element 탐색
1. 자식 탐색 firstElementChild, lastElementChild, children
2. 부모 탐색 parentElement
3. 형제 탐색 nextElementSibling, previousElementSibling
Node 탐색
1. 자식 탐색 firstChild, lastChild, childNodes
2. 부모 탐색 parentNode
3. 형제 탐색 nextSibling, previousSibling

node는 모든 걸 다 찾아서 잘 쓰지 않는다.

자식 방향 탐색

부모 방향 탐색

자식 아무거나 넣어서 탐색해도 똑같은 결과가 나온다. 부모는 하나니까

형제 방향 탐색

한칸 아래로 내려가는 걸 확인할 수 있다.

실습문제

• @실습문제:
• • 시작 #p2
• • 다음 다음 형제요소의 텍스트를 한글로 변경
• • 이전 형제요소의 텍스트에 이모지로 추가
• • 부모 요소의 글자크기를 24px로 변경
• • 마지막 자식요소의 글자에 그림자효과(text-shadow)추가
    

text shadow

https://www.w3schools.com/css/css_text_shadow.asp

undifind 오류

()
그런 속성 없는데? $target배열에서 style을 찾으니까 없다고 하는건데, 여기서 컬러라는 속성이 또 들어가니까 오류가 난 것.