JS 없이 섀도우 루트의 클래스를 타겟팅하는 방법은 무엇입니까?

Question

섀도 루트가 있는 html 요소가 있다고 가정해 보겠습니다.

으아악

Shadow 루트 내부에 div를 배치하는 방법은 무엇입니까?

저는

를 사용해 보았습니다. 으아악

하지만 그건 도움이 안 돼요. 내가 여기서 무엇을 놓치고 있는 걸까요?

Answer 1

• shadowDOM 내부의 태그를 사용하여 ShadowDOM의 스타일을 설정하세요

• 참조 ::part: https://developer.mozilla.org/en-US/docs/Web/CSS/::part

• 참조: : :slotted ShadowDOM 슬롯에 중첩된 자식을 위한 CSS 선택기

으아아아 으아아아

Answer 2

누군가에게 도움이 될 경우를 대비하여 div 包装了我的元素，添加了 ref를 사용하고

로 이동했습니다.

const Shadow = ref.current.querySelector('my-element').shadowRoot

const target = Shadow?.querySelector('.need-target-this')

target.style.whatever = '值';