Javascript 在浏览时编辑图像

我有这个代码，当我点击编辑图标时，它会在现有图像的下方添加一个新图像。我希望新映像替换现有映像

我知道我必须在div中使用index属性，但在这方面需要帮助。 在此处添加代码：

addImage = function(event){
var parent = event.currentTarget.parentNode.parentNode.parentNode,
            index = parseInt(parent.getAttribute('index')),
            script,
            clone = imageView.cloneNode(true),
            files = event.target.files;
        for (var i = 0,
                f; f = files[i]; i++) {

            // Only process image files.
            if (!f.type.match('image.*')) {
                continue;
            }

            var reader = new FileReader();

            // Closure to capture the file information.
            var imageBot = clone.querySelector('[name=imageBot]');
            if (imageBot)
                imageBot.innerHTML = '<svg style="position:absolute; top:45%;left:50%" class="spinner" width="25px" height="25px" viewBox="0 0 66 66" xmlns="http://www.w3.org/2000/svg">' + '<circle class="path" fill="none" stroke-width="6" stroke-linecap="round" cx="33" cy="33" r="30"></circle>' + '</svg>';
            clone.querySelector('.welcome-pane-user-content').setAttribute('data-type', 'image');

            setViewByIndex(index, clone.children[0]);
            document.querySelector('[name=insertOverlayView]').classList.add('hide');
            reader.readAsDataURL(f);
        }
};

addImage=函数（事件）{
var parent=event.currentTarget.parentNode.parentNode.parentNode，
index=parseInt（parent.getAttribute（'index'）），
剧本
clone=imageView.cloneNode（true），
files=event.target.files；
对于（var i=0，
f、 f=文件[i]；i++）{
//仅处理图像文件。
如果（！f.type.match（'image.*'））{
继续；
}
var reader=new FileReader（）；
//闭包以捕获文件信息。
var imageBot=clone.querySelector（“[name=imageBot]”）；
如果（imageBot）
imageBot.innerHTML=''+''；
clone.querySelector（'.welcome pane user content'）.setAttribute（'data-type'，'image'）；
setViewByIndex（索引，clone.children[0]）；
document.querySelector（'[name=insertOverlayView]'）.classList.add（'hide'）；
reader.readAsDataURL（f）；
}
};

---

这是纯javascript。请不要Jquery。

为什么不使用

URL.createObjectURL（f）

而不是将其作为base64读取，因为base64占用了~3倍的内存，而且cpu强度也更高。为什么不使用

URL.createObjectURL（f）

而不是将其作为base64读取，因为base64占用~3倍的内存，cpu强度也更高