Как я могу клонировать изображение в javascript


Я пытаюсь клонировать изображение в javascript, не загружая новое.
Обычно новые браузеры загружают изображение один раз, и есть несколько способов использовать это изображение снова. Проблема в том, что когда я тестирую его в IE 6, изображение запрашивает новое изображение с сервера.
У кого-нибудь есть информация о том, как это сделать в старых браузерах?

3 метода, которые не работают:

<html>
<head>
    <title>My Image Cloning</title>
    <script type="text/javascript">
        sourceImage = new Image();
        sourceImage.src = "myImage.png";

        function cloneImageA () {
            imageA = new Image();
            imageA.src = sourceImage.src;
            document.getElementById("content").appendChild(imageA);
        }

        function cloneImageB () {
            imageB =  sourceImage.cloneNode(true);
            document.getElementById("content").appendChild(imageB);
        }

        function cloneImageC()
        {
            var HTML = '<img src="' + sourceImage.src + '" alt="" />';
            document.getElementById("content").innerHTML += HTML;
        }
    </script>
</head>
<body>
    <div id="controle">
        <button onclick="cloneImageA();">Clone method A</button>
        <button onclick="cloneImageB();">Clone method B</button>
        <button onclick="cloneImageC();">Clone method C</button>
    </div>
    <div id="content">
        Images:<br>
    </div>
</body>

Решение

Добавлены кеш-заголовки на стороне сервера с простым файлом .htaccess в каталоге изображения ( s):
/img/.htaccess

Header unset Pragma
Header set Cache-Control "public, max-age=3600, must-revalidate"

Все вышеперечисленные методы javascript будут использовать загруженное изображение, если установлены заголовки кеша.

12
задан jam 31 October 2012 в 16:31
поделиться