jquery - 要素が DOM に追加されるたびに要素にクラスを追加する

Question

document.ready()asに次のコードがあります。

$(document).ready(function(){

   $('img').addClass('myClass');

});

すべての画像を一度にロードすると、このコードは正常に機能し、この関数はmyClassをそれら (すべての img) に追加します。しかし、ここで何が起こるかというと、imgのようなタグを持つ新しい要素が(ajax または javascript を介して) DOM に追加されるたびに、それにクラスが追加されないということです。 、または手動で行う必要があります。<img...../>

新しいimgが DOM に追加されるたびに、そのクラスがmyClassに設定されます。

PS現在、次のようにsetTimeout（）を使用して2秒後に関数を呼び出し、クラスを画像に追加しました：

setTimeout(function(){
  $('img').addClass('actAsButton');
},2000);

しかし、これは正しい方法ですか。実際、2秒後にDOMに新しいものを追加すると、このコードも失敗します。代わりにsetIntervalを使用できますが、メモリ使用量の点でかなりコストがかかります。光を当ててください。 .

Answer 1

$('img').load(function() {
  $(this).addClass('actAsButton');
})

Answer 2

あなたの場合、起動addClass時にimg要素がなかったため、は機能していません。$(document).ready()S0、そのために次のコードを使用する必要があります。

$('img').live('load', function () {
    $('img').addClass('actAsButton');
});

Answer 3

$(document).on('img', 'load', function() {
    $(this).addClass('actAsButton');
});