在JavaScript/jQuery中克隆內存中的圖像

這可能是一個非常簡單的，但我找不到答案。在JavaScript/jQuery中克隆內存中的圖像

我有以下的JavaScript/jQuery的代碼，我想創建加載消息：

// preload an image to use for dynamic loading icon whenever requested 
$(document).ready(function() { 
    var loadingIcon = document.createElement('img'); 
    loadingIcon.src = '../images/ajax-loader.gif'; 
    window.loadingIcon = loadingIcon; // chache in global var 
});

我想緩存負載的圖像，所以我不會每次都要求它我想要加載消息。我是否真的用上面的代碼實現了這一點？

這個想法是，頁面上有很多動態內容，並且在任何時候我都可能有幾個不同的加載圖標處於活動狀態。

我添加加載圖標與地方：

$('#myElem').appendChild(window.loadingIcon);

這並不實際工作，雖然，當我試圖表明一個新的加載圖標，它只是移動前面的一個，所以我不能有一次在頁面上不止一個。

我假設我需要克隆元素？

我試圖將元素包裝在一個jQuery對象中，以便與$(window.loadingIcon).clone()一起使用克隆，但是這種方式不起作用（函數錯誤）。

來源

2010-07-29 fearofawhackplanet

您可能克隆元素，是的。但是你也可以創建一個新的<img>元素。如果圖像src已被瀏覽器加載，圖像數據將被緩存，不會再發生網絡加載。你不需要緩存元素本身來緩存它指向的資源。

來源

2010-07-29 13:06:38 bobince

嘗試創建的圖像作爲jQuery對象：

var $loadingIcon = $('<img src="../images/ajax-loader.gif" />');

然後你應該可以克隆它，當你需要使用它：

$('#myElem').append($loadingIcon.clone());

來源

2010-07-29 12:43:38 DMA57361

我不能得到這個工作，不知道爲什麼。 – fearofawhackplanet 2010-07-29 14:00:53

@fear - 你得到什麼錯誤？ – DMA57361 2010-07-29 14:59:36

javascript有一個本地cloneNode方法，至少在IE7中，這是我目前所擁有的。我很確定它是跨瀏覽器。

這應該做你想要什麼：

$('#myElem').appendChild(window.loadingIcon.cloneNode());

來源

2010-07-29 13:34:32 lincolnk

在JavaScript/jQuery中克隆內存中的圖像

回答

相關問題