Javascript 找不到NotFoundError节点映像\u div.parentNode.removeChild（img）

我在removeChild（）上班时遇到问题。我收到“NotFoundError:未找到节点映像_div.parentNode.removeChild（img）；”错误

这是我的密码：

<div id="imagesframe"> </div>

<script>
images_array = [image1.jpg,image2.jpg,image3.jpg,image4.jpg,image5.jpg];
var image_div = document.getElementById('imagesframe');
for(var i=0 ; i<images_array.length ; i++) {
    var img = new Image();
    img.src = images_array[i];
    img.style.width = '500px';
    img.style.height = '500px';
    setTimeout(function(){image_div.appendChild(img)},1000);
    image_div.parentNode.removeChild(img);
}
</script>

images_数组=[image1.jpg，image2.jpg，image3.jpg，image4.jpg，image5.jpg]；
var image_div=document.getElementById（'imagesframe'）；
for（var i=0；i在循环中使用
setTimeout
将正确的
img
传递给参数函数时会使事情变得复杂。此外，您可能在数组中省略了图像URL周围的引号

然后，
setTimeout
，它不会阻止循环执行，它只是一个计时器，在给定的延迟后启动参数函数。在您的代码中（没有其他错误），所有五个函数调用在1秒后几乎同时完成，因为循环在微秒内每轮创建一个新的计时器

这里有一种使用简单外部范围访问的替代方法

window.onload = function () {
    var imagesArray = ['image1.jpg','image2.jpg','image3.jpg','image4.jpg','image5.jpg'], // URLs of the images
        imageDiv = document.getElementById('imagesframe'), // An element wherein to show the images
        counter = 0, // Image counter
        img;  // A temporary image element

    // Changes images in an element
    function changeImg (first) {
        if (!first) { // Check, if there's an image to remove
            imageDiv.removeChild(img); // Remove an image
        } else { // Reset counter, just in case the slideshow will be reused
            counter = 0;
        }
        // Create a new image and append it to an element
        img = new Image();
        img.src = imagesArray[counter];
        img.style.width = '500px';
        img.style.height = '500px';
        imageDiv.appendChild(img);
        // Show more images or quit
        counter += 1;
        if (counter < 5) { // Show the next image
            setTimeout(changeImg, 1000);
        } else { // Remove the last image
            setTimeout(function () {imageDiv.removeChild(img)}, 1000);
        }
    }
    changeImg(true); // Show the first image
    return;
};

为什么要尝试从父级的父级查找映像？
img.parentNode.removeChild（img）
会更好。
img
在超时过期之前找不到。可能您误解了
setTimeout
，它不会延迟其余代码的执行，只会延迟调用参数中传递的函数。我甚至尝试了image\u div.removeChild（img）；但这不起作用。那么，在这里做什么呢？好的，现在我知道我必须修复我的setTimeout（）函数，这现在更复杂了。看起来我必须想出另一个解决方案。请解释您实际要做什么？第二次显示一个图像，第二次显示，等等？是的，我正在尝试一个接一个地显示图像，其中第一个图像消失，下一个图像显示在同一位置，对于所有图像在循环中的数组中调用。非常感谢您提供了这个非常详细的代码答案！它不像我最初认为的那么简单！递归在这里绝对有意义。实际上，代码不是递归的，它是从外部重新调用的。无论如何，这种类型的实现广泛用于超时。您也可以使用循环来实现，但它会要比我的简单方法更复杂。如果你觉得答案有用，你可以在答案的左上角打勾接受它。通过接受答案，其他访问者可以看到，你的问题已经解决了，我们都可以从第If行（计数器<5）中获得一些“非递归”的回报{//显示下一个映像设置超时（changeimg1000）；它是递归的，因为它是从函数内部调用的。我试图投票支持你，但它不允许我这样做。显然，我需要更多的声誉来这样做，我认为这是愚蠢的。
changeImg
不是在
changeImg
内部调用的，执行也不会返回到
changeImg
，因此代码不是递归的。定时
changeImage
s由浏览器调用，其过程与事件侦听非常类似（除非相同），执行过程也会返回到该流程。关于投票，您需要15个代表才能获得投票权。这很快就会获得，如果您觉得答案解决了您的问题，您可以从接受答案开始；）。我接受了你的答案：-）我想我被你的意思弄糊涂了，那不是递归的。因为看到函数调用本身就是我从你的代码答案中看到的。
(function () {/* Code to run here */}());