問題タブ [clonenode]
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.
javascript - appendChildの後に外部ファイルからsvgシンボルを表示する方法
したがって、基本的には、svg シンボルを含むコンポーネントを作成するために使用したいと考えています。
<use href="/svg/icons.svg#my-icon"/>
ご覧のとおり、通常の html で完全に機能する外部 svg アイコン ファイルを参照しています。しかし、この基本的なJavaScript関数を実行したいのですが、DOMに追加した後、アイコン自体は表示されません。
したがって、基本的には、テンプレート コンテンツのクローンを作成し、ドキュメントの本文に追加するだけです。アイコン自体がレンダリングされないことを除いて、完全に機能します。作成した DOM に svg ノードがありますが、アイコンが画面に表示されません。<svg>
現在の HTML ドキュメントにシンボルがリストされているインライン ドキュメントを含め、アイコンを参照すると<use href="#i-my-icon"/>
、期待どおりに動作します。アイコンが表示されます。.svg
この場合、外部ファイルを引き続き使用するにはどうすればよいですか? svg アイコンを直接インライン展開したり、すべての HTML ドキュメントやテンプレートにアイコン セットを含めたりすることはしたくありません。
javascript - ノード リストが稼働していない/アレイに転送されていない
ノードごとに関数を呼び出そうとしています。notchlick 関数でノッチ配列が定義されている場合、配列は作成されません。関数の外に配置すると、配列には元のノードのみが含まれ、クローンは含まれません。配列はhtmlcollectionなので、ライブリストになると思います。
複製されたノードは、オリジナルのようには動作しません。示されているように、配列が関数の外で宣言されている場合、これが問題の原因ですか? また、クロージャーについての私の理解を考えると、関数にネストされたときに配列が登録されない理由がわかりません。