問題タブ [web-component]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票する
1 に答える
877 参照

javascript - カスタム要素内のスクリプト タグ

Google マップの API を使用する Polymer を使用してカスタム要素を作成しています。この要素に、Google マップのスクリプト タグを含めて処理してもらいたいと考えています。

カスタム要素内のどこに配置する必要がありますか? 単純にページの上部に配置すると、クロスオリジンの問題が発生します。

0 投票する
1 に答える
17825 参照

javascript - Polymer および WebComponentsReady イベント

Polymer docsによると、WebComponentsReadyイベントが必要な理由は...

ポリフィルは要素定義を解析し、アップグレードを非同期的に処理します。要素がアップグレードされる前に DOM から時期尚早に要素を取得すると、HTMLUnknownElement を操作することになります。このような状況では、要素を操作する前に WebComponentsReady イベントを待ちます

単一の Web コンポーネントをインポートし、すべての Web コンポーネントがロードされたときにステートメントをログに記録するハンドラーを登録する HTML ページがあります。

WebComponentsReadymy-element のreadyポリマー イベントの前にイベントが発生するのはなぜですか? カスタム要素と対話できるタイミングを知る必要があります。たとえば、プロパティを変更してパブリック メソッドを呼び出すなどです。

0 投票する
1 に答える
186 参照

polymer - カスタム要素で、周囲のページのスタイルをリンクに使用するにはどうすればよいですか?

Shadow DOM にリンクを生成するカスタム<my-header>要素があり、周囲のページの他のリンクと同じスタイルにしたいと考えています。古いapplyAuthorStyles属性はそれを達成するための適切な方法でしたが、独自の問題がありました. これapplyAuthorStylesが削除されたので、私が目にするオプションは、組み込み者にグローバル スタイルを次のように定義させることです。

ページのスタイルを必要としない要素のスタイルに侵入します。

これを行うより良い方法はありますか?

http://jsbin.com/yusox/1/edit以下にいくつかのサンプル コードがあります。ブラウザーでネイティブの Shadow DOM がオンになっている場合にのみ、矛盾が表示されます (Chrome では chrome://flags/#enable-experimental-web-platform-features)。

0 投票する
2 に答える
606 参照

css-selectors - ほとんどの子の*後に*特定の要素を選択するシャドウ DOM を作成するにはどうすればよいですか?

メインコンテンツ<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にあります。

0 投票する
1 に答える
185 参照

less - Less はカスタム要素をサポートしていますか?

Less は Web コンポーネントのカスタム要素仕様をサポートしていますか? ( http://w3c.github.io/webcomponents/spec/custom/またはよりアクセス可能なhttp://www.x-tags.org/docs )