从 Shadow DOM 中获取 GetElementById

Question

我有一个带有 shadow DOM 的自定义元素，它侦听属性target更改。
target应该是我的组件应该附加到的元素的 ID。

我试过使用querySelector和getElementById来获取外部 DOM 的元素，但它总是返回null.

console.log(document.getElementById(target));
console.log(document.querySelector('#' + target));

以上两者都返回null。

有没有办法从 shadow DOM 中获取对父文档中元素的引用？

Answer 1

你只需要调用Shadow?Root。

this.shadowRoot.getElementById('target') 应该管用。

这是一个示例，get语法将对象属性绑定到函数。

get target() {
    return this.shadowRoot.getElementById('target');
}