javascript - 使用 DOM、Javascript 加载和删除图像

Question

我是 DOM 的新手，我在删除我加载的多个图像时遇到了问题

这会加载 7 张图片(1.jpg、2.jpg 等)

function loadImages() {

    for (var i = 1; i < 8; i++ ) { 
        var img = document.createElement("img"); 
        img.src = "images/"+i+".jpg";
        var idName = "img"+i+"";
        document.getElementById(idName).appendChild(img);
    }
}

这应该删除所有这些，但没有..我认为它在 removeChild 行中断。

function removeImages() {   

    for (var i = 1; i < 8; i++ ) { 
        var idName = "img"+i+"";
        var d = document.getElementById(idName);
        d.removeChild(document.getElementById(img));
    }
}

我认为我做的事情从根本上是错误的，因为我不完全理解它是如何工作的...

Answer 1

在 removeImages 函数中，变量 img 没有被初始化。即使是这样，您也没有在 loadImages 函数中为任何图像设置 id。您可以这样修改您的代码:

function loadImages() {

    for (var i = 1; i < 8; i++ ) { 
        var img = document.createElement("img"); 
        img.src = "images/"+i+".jpg";
        img.id = i;
        var idName = "img"+i+"";
        document.getElementById(idName).appendChild(img);
    }
}

function removeImages() {   

    for (var i = 1; i < 8; i++ ) { 
        var d = document.getElementById(i);
        d.parentNode.removeChild(d);
    }
}