要素またはhtmlタグが存在するかどうかを確認します

Question

私はjavascriptツリーを持っています。ここでユーザーはツリーノードを選択してボタンをクリックし、次にその選択されたツリーノードの隣にアイコンを追加します。ここ

は、そのツリー内の1つのノードのソースコードである：以下

<li node_id="4" name="mars" > 
<ins class="jstree-icon"> </ins> 
<a href="#" class="jstree-clicked"><ins class="jstree-icon"> </ins> Mars Planet 
    <a style="cursor: default;"><ins class="pattern-icon3"> </ins></a> <!--this line displays the icon--> 
    <a style="cursor: default;"><ins class="pattern-icon3"> </ins></a> <!--this line displays the same icon again--> 
</a> 
</li> 
. 
. 
. 

iはツリーノードの隣のアイコンを追加するために使用するコードです。

$j("li[name='"+node_name+"'] > a").append('<a style="cursor:default;"><ins class="' + icon_class + '">&nbsp;</ins></a>'); 

アイコンが正しく表示されます。

私の問題は、次のとおりです。

私は一度だけ、特定のアイコンを表示する必要があります。 現在、ユーザーがノードを選択してボタンを2回クリックすると、その選択されたノードの隣に2つのアイコンが追加されます。

追加する前にノード名の隣にすでに<a style="cursor: default;"><ins class="pattern-icon3"> </ins></a>が追加されているかどうかを確認する方法はありますか？

Answer 1

あなたはfind()を持つ要素にマッチするだけ一致した場合、それを追加してみてください失敗：

var listItemLink = $j("li[name='" + node_name + "'] > a"); 
if (!listItemLink.find("." + icon_class).length) { 
    listItemLink.append('<a style="cursor:default;"><ins class="' 
     + icon_class + '">&nbsp;</ins></a>'); 
} 

Answer 2

.pattern-icon3要素を選択して、結果のオブジェクトのlengthプロパティをチェックすることができます。要素が存在しない場合、lengthは0になります。それが存在しない場合、それは0より大きくなります。あなたはそのHTMLを確認したい場合は

if($j("li[name='" + node_name + "'] > a .pattern-icon3").length) { 
    //Already exists! 
} 

Answer 3

存在：

if ($('#selector').length > 0){ 
    alert('tag exists'); 
} 

Answer 4

ちょっと考えましたが、おそらく.oneを使用できますか？

$("li[node_id]").one("click", function() { 
    // show the icon 
});