javascript - 从 Shadow DOM 中获取 ElementById

Question

我有一个带有影子 DOM 的自定义元素，它监听属性 target 的变化。
target 应该是我的组件应该附加到的元素的 ID。

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

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

以上两个都返回null。

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

Answer 1

您只需调用 Shadow​Root .

this.shadowRoot.getElementById('target') 应该有效。

这是一个例子，get语法会将对象属性绑定(bind)到函数。

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