Javascript Web组件：如何使用shadowRoot.querySelector访问有槽元素

嗨，我是新的网络组件的概念。我想知道我们是否可以使用shadowRoot.querySelector访问一个开槽元素

我实现了一个输入字段作为插槽，用于动态设置一些值。并在其中添加一个类“列标题”。我正试图像这样访问connectedCallback（）中的这个元素

var titleInput=this.shadowRoot.querySelector（“.column title”）

但它返回null

---

请帮助。

我不确定问题出在哪里，但您应该能够使用

查询选择器及其类获得插槽。我在下面模拟了一个例子

控制台将打印出插槽的引用。如果您附加一个类只是为了查找插槽，那么最好设置一个id（假设它在影子根中），并使用
this.shadowRoot.getElementById（'my-slot-id'）查找它。


customElements.define（'blue-box'，
类扩展HtmleElement{
构造函数（）{
超级（）；
var模板=文档
.getElementById（'blue-box'））
.内容；
const shadowRoot=this.attachShadow({
模式：“打开”
})
.appendChild（template.cloneNode（true））；
}
connectedCallback（）{
log（this.shadowRoot.querySelector（'slot.targetslot'）；
}
});

.蓝边{
边框：2件纯蓝；
填充物：5px；
保证金：5px；
}
需要内部
我的内部文本
请点击此处：
失去了@royyko的回应。这里更好的答案是，不要为了抢占位置而给出类或id。。。使用已提供的标识符及其名称。要做到这一点，您需要执行以下操作
this.shadowRoot.querySelector（'slot[name=interior]”）
我现在可以获取元素了。我正在动态地添加类。当我在模板slot元素上直接给出类名时，它工作得很好。谢谢你的帮助！