在 Polymer 中获取元素内容而不显示在页面上

Question

我正在使用 Polymer 1.0 构建自定义元素，需要使用 javascipt 获取标签内的内容，而不是将其显示在页面上。我尝试使用 <content> 标记并使用查询选择器将其提取到 javascript 中。这有效，除了它显示在页面上，即使我使用 style="display: none;" 属性也是如此。如何获取标签内的内容而不显示在页面上？

Answer 1

不确定您的具体用例是什么，但是简单地用隐藏的 <div> 包装您的 <content> 标签怎么样？

<dom-module id="x-test">
  <template>
    <div hidden>
      <content id="content"></content>
    </div>
  </template>
  <script>
    Polymer({
      is: "x-test",
      attached: function () {
        // access distributed content like this
        var myContent = Polymer.dom(this.$.content).getDistributedNodes();
      }
    });
  <script>
</dom-module>

在 Polymer 中获取元素内容而不显示在页面上

Get element content without displaying on page in Polymer

html

javascript

css

polymer