JavaScriptとID衝突でウェブマスター向けのウィジェット

Question

他のウェブサイトやフォーラムに配置できるウィジェットを作成したいと思います。

<script type="text/javascript" src="http://example.com/x.js" /> 
<div id="myid"></div> 

しかし、問題がある - 誰かが1つのウェブサイト上で2つの以上のこのようなウィジェットを置くとき、彼らがためにIDを正しく動作しませんが。

このような状況を防ぐにはどうすればよいですか？

JSからこのdivにアクセスする必要があるため、クラスを使用できません。 ランダムに生成された数値をIDの末尾に追加することを考えましたが、まだID衝突の可能性があります（小さいですが、あります）。

Answer 1

あなたは、処理時にdivを生成し、それに一意のIDを割り当てるスクリプトを含めることができます。 （そのロジック内で、重複をチェックすることができます）

あなたのウィジェットが1000回含まれるとは思わないと思われます。

var uniqueID; 
var foundUniqueID = false; 
var idx = 0; 
while(foundUniqueID != true){ 
    uniqueID = 'myID_' + idx; 
    if(document.getElementById(uniqueID)){ 
    idx++; 
    } else { 
    foundUniqueID = true; 
    } 
} 
//create your DIV with your uniqueID etc. 

Answer 2

最も良い方法は、より柔軟にすることです。だから、定義されたhtmlのidを持って、それを持つようにユーザーを強制するのではなく、ユーザーがそのidを選ぶ方法を提供する必要があります。そして、コールが行われなければなりません。このような

何かがきれいである：

<script type="text/javascript" src="http://example.com/x.js"></script> 
<script type="text/javascript"> 
    X.callMethod("myId"); 
</script> 
<div id="myid"></div> 

この方法では、2つの利点があります。

• それはユーザは、彼があなたから欲しいものを振る舞いを指定
• 独自のIDを定義することができますスクリプト。それで、同じ方法で使用できる他のメソッドを追加することができます。ユーザーはあなたのコードが侵入的であると感じることはありません、彼は彼が機能を望んでいるかどうかを決めるのです。