iframeを削除してライブラリとの競合を防ぎます

Question

私たちはcarrusel画像を作成するアプリケーションを持っており、iframeを使ってWebページに挿入しています。

このような何かが私達のユーザーが自分のページに挿入することで、我々はインラインフレームを削除したい、と私たちはただ一つのdivで動作するようにすべての準備ができてい：

<script src="https://www.example.com/mycustom-carrusel.min.js"></script> 
<div id="custom-unique-id" style="width:100%;height:300px;"></div> 

mycustom-carrusel.minを.jsにはすべてのコードがgulpで縮小されています。

私たちのjavascriptはAPIを呼び出してdiv内に必要なすべてをペイントしますが、問題はjQueryなどのライブラリを使用していることです。

たとえば、jQueryなどのユーザーのWebページと競合する可能性のある他のライブラリとの競合を防止したいと考えています。

これを実装し、コードとの競合を防ぐには最高の技術は何ですか？

ありがとうございます！

Answer 1

ウィジェットが埋め込まれているページからスタイルとスクリプトを分離するのは、通常、iframeが通常使用される理由です。ちょうどiframeを使用してください。 （一度、すべての一般的なブラウザに実装された）いくつかの将来

、代わりの iframeは、あなたのウィジェット要素とそのネストされたため、すべての継承されたスタイルをリセットするために、 unset、 initial、または revertの値で all CSSプロパティを使用することができます独自のスタイルを安全に適用することができます。一般的にはJSライブラリについては

は、競合を防ぐための普遍的な方法はおそらくありませんが、特にjQueryのために、あなたは（jQueryの自体の異なるバージョンを含む他のライブラリのためにそれを可能にするために、両方の$とjQuery変数を解放するためにjQuery.noConflict(true)を使用することができます）これらの変数を再利用するには、jQueryバージョンを含めることができ、jQuery.noConflict(true)の前にのjQueryバージョンを呼び出すことができます（これはほとんどありません）。あるいは、ライブラリを使用しなくても済むように（ほとんどの場合、jQueryのようなライブラリは現在実際には不要です）、代わりに独自のvanilla-JSスクリプトを使用するか、本当にライブラリを使用して削除できない場合は、自己実行匿名関数でライブラリのコード（ライブラリを使用する独自のコードと一緒に）を定義し、それが定義する変数がグローバル名前空間に漏れないようにします。