0

私は現在、jQuery .add() メソッドを使用して DOM に要素を追加し、すぐにそれにアクセスしようとする JavaScript 関数を持っています (この場合、クラスを追加し、少し待ってから再度削除します)。

elem = "<p id="new">added element</p>"
jQuery("body").add(elem)
jQuery("#new").addClass("red")
setTimeout(function(){
    jQuery(".new").removeClass("red")
},1000)

問題は、jQuery セレクターが .new 要素を見つけられないことです。同様の問題に対して私が見つけたすべての解決策には、要素が読み込まれた後にクリック/マウスイベントを要素にバインドすることが含まれますが、これはこの場合探しているものではありません。jQuery.add() の代替案も調べましたが、同じ問題が発生する jQuery.append() しか思いつきませんでした。

関連性がある場合、このコード スニペットが含まれる関数は、jQuery(document).ready() 関数の外にあります。

tl;dr バージョン:
jQuery.add() を使用して要素を追加した直後に要素を操作 (例: クラスを追加) するにはどうすればよいですか?

4

3 に答える 3

1

あなたはそれをすべて間違えました

  1. 文字列連結が適切にエスケープされていません"
  2. 使用しているidとclassセレクターが見落とされています (id -#および class - .)
  3. .add()は新しい要素の追加には使用されません。.append ( )を使用する必要があります

試す

elem = '<p class="new">added element</p>'
jQuery("body").append(elem)
jQuery(".new").addClass("red")
setTimeout(function(){
    jQuery(".new").removeClass("red")
}, 1000)

デモ:フィドル

私はそれを次のように書くかもしれません

var elem = $('<p class="new">added element</p>').appendTo('body').addClass('red');
setTimeout(function(){
    elem.removeClass("red")
}, 1000);

デモ:フィドル

于 2013-06-07T00:47:55.280 に答える
1

.に変更#

jQuery("#new").addClass("red")
setTimeout(function(){
    jQuery("#new").removeClass("red")
});

または、クラスを意味する場合は、マークアップを id の代わりにクラスに変更します。

elem = '<p class="new">added element</p>'

.newclassnewを持つ#new要素をターゲットにし、 id を持つ要素をターゲットにしnewます。

.add() は要素を DOM に追加しません。body次のようにして、append を使用して要素を最後の子として追加できます。

jQuery("body").append(elem)
于 2013-06-07T00:48:04.580 に答える