Question

如何使用 Polymer 查询元素 DOM 中的选择器元素

2015-06-04

11321

polymer polymer-1.0

我有我的元素：

<dom-module id="x-el">
  <p class="special-paragraph">first paragraph</p>
  <content></content>
</dom-module>

并且我使用它像

<x-el>
  <p class="special-paragraph">second paragraph</p>
</x-el>

在我的命令式部分：

Polymer({
  is: 'x-el',

  ready: function () {
    /* this will select all .special-paragraph in the light DOM
       e.g. 'second paragraph' */
    Polymer.dom(this).querySelectorAll('.special-paragraph');

    /* this will select all .special-paragraph in the local DOM
       e.g. 'first paragraph' */
    Polymer.dom(this.root).querySelectorAll('.special-paragraph');

    /* how can I select all .special-paragraph in both light DOM and
       local DOM ? */
  }
});

是否可以使用 Polymer 内置函数来实现这一点？或者我应该使用默认的 DOM api 吗？

Answer 1

聚合物提供辅助功能或抽象，该功能将列出光和 local doms。

如果您需要此功能，您可以使用。 /code>方法，聚合物还提供 $$ 实用程序功能，可帮助访问元素的本地DOM的成员。此函数的使用如下：

870638006

请注意，与 QuerySelectorall 不同， $$ $$ 功能仅返回一个元素：与选择器相匹配的本地DOM中的 第一个 元素。

Answer 2

您可以记住的另一个解决方案是：

var elements = this.shadowRoot.querySelectorAll("input")

José Júnior

2019-12-15