如何 Select 带有 Select 或 Polymer 2.x 的所有元素

Question

我正在尝试 select Polymer 2.x 中具有 class="test" 的所有元素，但我 运行 遇到了问题。

document.querySelectorAll('.test') select没什么

document.body.querySelectorAll('.test') select没什么

this.querySelectorAll('.test') select没什么

this.shadowRoot.querySelector('.test') 仅 select 页面上的第一个匹配节点

注意：这些都是在单个文档中呈现的，不需要打破阴影 DOM 层。

Answer 1

因此，shadowRoot最终也支持querySelectorAll方法（使用All），应该 return 包含与该查询匹配的所有项目的节点列表。

例如，如果您打开使用 shadowDom 的 Polymer News App：

https://news-docs.polymer-project.org/

和运行查询：

document.querySelector('docs-app').shadowRoot.querySelectorAll('.tab');

它 return我有 3 个项目。

因此，对于您的情况，请尝试以下操作：

this.shadowRoot.querySelectorAll('.test');