5

私の全体的な問題は、画像の遅延読み込みです。画面に表示されているときにのみ画像を読み込むようになりました。画面に表示されていない画像を削除する必要があります。

と思った

$(image).removeAttr("src")

それを実行し、srcを正しく削除しますが、画面から画像をクリアしたり、altにあるものに置き換えたりすることはありません。

画像を削除するにはどうすればよいですか？注：imgタグは削除したくありません（後で必要になります）。画面から画像をクリアするだけです。

関連する可能性のある他のコード（理由はわかりませんが）-

updateCarImages:=>
    imagesOnScreen = $(@el).find(".carImageClass:onScreen")
    imagesOffScreen = _.without(cachedImagesOnScreen,imagesOnScreen)
    for image in imagesOnScreen
      imgSrc = $(image).attr("src")
      if (!imgSrc)
        id = $(image).data("tooltip-id")
        console.log(id)
        result = resultsStore.get(id+"")
        console.log(result)
        $(image).attr("src", result.get("carImageUrl"))
    console.log(imagesOffScreen)
    for image in imagesOffScreen
      $(image).removeAttr("src")
4

7 に答える 7

4

あなたが記憶をクリアしようとしているなら（私が見るように、それが見えない画像を削除する唯一の理由になるでしょう）、あなたは乗り物に乗っています。

ブラウザにそれを強制する防弾方法はありません。ブラウザがガベージコレクタを呼び出す唯一の方法は、特定のメモリ制限に到達してから、コレクタに最初に何を取得するかをヒントにすることです。

ノードをビンに移動して空にするのは良い方法と考えられています。

var $trash = $('<div>').hide().appendTo('body');

var waste = function(node) {
    $trash.append(node).html('');
}

ソースを空のGIFに置き換えると幸運になるかもしれません。

$(image).attr('src','data:image/gif;base64,R0lGODlhAQABAPABAP///wAAACH5BAEKAAAA‌​LAAAAAABAAEAAAICRAEAOw%3D%3D');

これにより、ノードと画像の幅/高さも維持されます。

しかし、これがあなたのケースでパフォーマンスの向上につながるかどうかは非常に疑わしいです。最善のことは、あまりにも多くのデータでブラウザにストレスをかけないことです。

iOS for iPad（特にバージョン4.x）はメモリ制限が低いことで知られており、IMGノードが多すぎると簡単にクラッシュする可能性があります。

于 2012-09-06T09:22:46.323 に答える
3

問題がパフォーマンスである場合は、既存の遅延読み込みjQueryプラグインを使用できます。車輪の再発明をする意味はありません。

http://www.appelsiini.net/2012/lazyload-170

または、このプラグインを使用したくない場合は、src値をdata-*属性に格納し、表示する場合にのみアタッチすることsrcができます。

隠すとき：

$(image).data("src", $(image).attr("src"));
$(image).removeAttr("src");
$(image).hide();

表示時：

$(image).attr("src", $(image).data("src"));
$(image).show();
于 2012-09-06T08:58:17.980 に答える
2

画像を非表示にするには：

$(image).hide();

これstyle="display:none;"により、画像が設定され、表示されなくなります

画像を削除するには：

$(image).remove();

これにより、DOMから物理的に削除されるため、存在しなくなります

ハイブリッドアプローチ（画像をDOMに残し、後で変更できるようにします）

//Remove the SRC and hide the image
$(image).removeAttr("src").hide();

//Then when you want to change to a new image
$(image).attr("src", "iamge.gif").show();
于 2012-09-06T08:59:24.130 に答える
1

画像を非表示にするだけです。そこに行きたくない場合は、1pxの画像を作成することができます。

$(image).attr('src', '1px.png');
于 2012-09-06T08:59:28.293 に答える
1

画像を非表示にしたいが、スペースを占有し、コンテナのスクロールバーに影響を与えないようにする場合は、次のvisibility: hiddenスタイルを使用します。

$(image).css('visibility', 'hidden');
于 2012-09-06T09:03:44.070 に答える
0

このコードから画像を削除するだけです。私はそれを試しました。

$('.img2').dblclick(function()
{
    $(".img2").removeAttr('src');
});
于 2017-03-10T06:28:22.417 に答える
-1

この次のコードは、画像ソースを削除する方法を示しています

 var image_holder = $("#preview-image-holder");
 image_holder.empty();
于 2020-03-04T18:29:22.977 に答える