Shadow DOM을 알아보자
이전 글에서 DOM에 대해서 알아봤습니다. 쉬운 내용은 아니었지만, 브라우저가 어떻게 HTML과 CSS, JS를 렌더링하는지 알 수 있었을 겁니다. 이제는 한단계 올라가봅시다. HTML의 모든 요소와 Style로 이루어진 DOM은 global한 범위에 있습니다. 어떤 요소가 얼마나 많은 부모를 가지고 있든지 간에, getElementById나 querySelector를 통해서 접근이 가능하죠. CSS도 마찬가지고요. 그 덕분에 우리는 부모는 신경쓰지 않고 모든 요소의 Style을 한꺼번에 변경할 수 있습니다. div { color: red; } 그런데 이렇게 잘 사용하다가 어떤 div와 그에 속한 자식들에게는 color를 blue로 줄 필요가 생겼습니다. 이럴 때는 어떻게 해야 될까요? 바로 이럴 때 필..