修改

Question

使用javascript，我添加两个按钮，一个将添加图片，另一个将删除图片。我刚刚练习考试......

按钮和功能添加图片工作精美，我正在努力删除图片的功能。如果我将两个按钮和图片添加到网站，并在图片中添加一个ID，并通过ID删除该图片。但如果我只有两个按钮并尝试开始添加图片，那么我就没有身份证，所以我迷路了！

下面的deleteMe函数可以正常删除第一张图片。但是当我加载网站时我不想要任何图片，我只想要添加和删除这两个按钮。所以我不知道如何删除元素。这是我到目前为止的两个功能，谢谢!!!：

function deleteMe(){
    var toDelete = document.getElementById('image23');
    toDelete.parentNode.removeChild(toDelete);
}

function addMe(){

    var img = document.createElement('IMG');
    img.setAttribute("src", "elephant.jpg");
    img.setAttribute("width", "60");
    img.setAttribute("height", "60");
    document.body.appendChild(img);

}

Answer 1

document.body.removeChild(toDelete);

Answer 2

我想你忘了给你正在创建ID的图像。

您正在使用：

var toDelete = document.getElementById('image23');

要获取要删除的图像，但不要将该ID分配给图像。要在制作图像时添加ID，请使用以下任一项：

img.setAttribute("id", "image23");

或

img.id = 'image23'

修改

如果您允许添加多个图像，并且只想一次删除一个图像，那么我认为sakurashinken评论的方法可能更理想，但不是抓住：

document.getElementsByTagName("IMG")[0]

你应该使用一个类，因为你的页面上有其他图像。

这将使你的新addMe：

...
img.setAttribute("src", "elephant.jpg");
img.className = 'deletebybutton';
img.setAttribute("width", "60");
...

你的新deleteMe：

var toDelete = document.getElementsByClassName("deletebybutton")[0];
toDelete.parentNode.removeChild(toDelete);

JavaScript如何删除子项

2 个答案:

修改