如何在safari中找到shadow DOM中的元素？ （聚合物）

Question

我在Polymer上使用paper-input，在chrome中我可以在shadow DOM中找到元素

var input = this.$.input.querySelector(':host /deep/ input')

但这在Safari中不起作用。我认为＆＃34; / deep /＆＃34;中存在问题。 如何在Safari中找到元素？

Answer 1

除Chrome，Opera和Andriod（http://caniuse.com/#feat=shadowdom）之外的任何浏览器都不支持Shadow DOM和所有连接的选择器。这就是为什么在Polymer 1中我们有阴影DOM。

现在来自Polymer的人们也想到了影子DOM的好处（没有设计出血），所以他们提出了阴暗的DOM。这有必要：

1. 如果您将CSS放入模板 - 尤其是CSS选择器 - 它会被重写。这就是:host，/deep/或::shadow等内容的原因。
2. 如果您在JS中使用选择器，就像您一样，您不必费心使用这些特殊选择器。只需看看DOM就可以了。因此，例如document.querySelectorAll('paper-input')可以获取所有paper-input个元素，无论它们位于DOM中的哪个位置。