サイトファイル(HTML/CSS/JS)を読み込んだ後にKARTEのアクション「埋め込み > HTML要素を変更・挿入する」を行う場合の質問です。
置き換え後のDOM構造を置き換え前の状態と同様にした場合に、
置き換え前の要素に紐づいていたCSS/JSを再度置き換え後の要素に紐づける方法はございますか。
(再度JSモジュールをnewしたりせずに、既にメモリ上に存在する処理(JSなど)を置き換え後の要素に紐づけたいです。)
<※追記です。>
KARTEでJQueryのrepralseWith()で要素の置き換えをしていると思いますが、
イベントとのバインドが削除されてしまうので、再度バインドしなおす対応が必要と考えております。
上記は、KARTE上で対応することはできますでしょうか。
ご確認の上、お気付きの点をご教示頂けますと幸いです。
置き換え後のDOM構造を置き換え前の状態と同様にした場合に、
置き換え前の要素に紐づいていたCSS/JSを再度置き換え後の要素に紐づける方法はございますか。
サイトの実装に依ると思いますので、一般論でお答えします。
CSSについては、置き換え前後でCSSセレクタに使用している属性やタグ名などが変更されなければ、サイト側のCSSが適用されるかと思います。なお、KARTEのWidgetではCSSのモジュール化処理によってclass名が自動変更されるので、その点だけご注意ください。
JSのイベントハンドラについては、ご認識の通り、要素が置き換えられると登録が解除されると思います。KARTEで配信するJSからaddEventListener()で置き換え後の要素にイベントハンドラを登録することは可能ですが、呼び出したい関数に特有の処理がグローバルから参照できない場合は、JavaScriptの仕様上、イベントハンドラの再登録は難しい認識です。
承知しました。
ご回答いただきありがとうございます!