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);
    }
}

Answer 2

您的代码示例意味着您尝试删除图像的子元素而不是图像本身。此外，您使用错误的变量来引用图像。当你替换这一行时，它可能会起作用：

    d.removeChild(document.getElementById(img));

有了这个：

    d.parent.removeChild(document.getElementById(idName));

此外，如果您不熟悉DOM树，您可能需要查看jQuery，它比常规DOM指令更独立于浏览器。

Answer 3

如果您正在进行DOM操作，我建议您使用jQuery（或者至少尝试一下）。

它会让你的生活更加愉快，你会成为一个更快乐的人，它会阻止你犯下harakiri。

使用DOM，Javascript加载和删除图像

3 个答案: