3

メインコンテンツ<figure>の下に配置したいカスタムのような要素を書いています。私が使用しているカスタム要素の子ノードからいくつかのコンテンツ (潜在的なフォーマットを含むテキスト) を含める必要があり<figcaption>ます。ただし、Shadow DOM の仕様に従って、カスタム要素の本体を配置した以前の要素には既に配布されています。<figcaption><content select="span.caption"></content><span><content></content>

<content select=":not(span.caption)"></content>キャプションの配布を避けるために使用しようとしましたが、それは複合セレクターではないようで、何も一致しません。

必要な順序で要素をレンダリングするための推奨される方法は何ですか?

問題のあるコードは次のとおりです。これもhttp://jsbin.com/vizoqusu/3/editにあります。

<!DOCTYPE html>
<html>
<head>
  <script src="//cdnjs.cloudflare.com/ajax/libs/polymer/0.1.4/platform.js"></script>
  <script src="//cdnjs.cloudflare.com/ajax/libs/polymer/0.1.4/polymer.js"></script>
  <meta charset="utf-8">
</head>
<body>
  <polymer-element name="my-figure" noscript>
    <template>
      <figure>
        <content></content>
        <figcaption>Figure 7: <content select="span.caption"></content></figcaption>
      </figure>
    </template>
  </polymer-element>

  <my-figure>
    Hello World!
    <span class="caption">The caption</span>
  </my-figure>
</body>
</html>
4

2 に答える 2