replaceChild() 在 javascript 中移动仅运行一次的图像

Question

我有 3 个图像并排，我必须在它们下面放 2 个按钮。单击前进，图像应向前移动并改变位置，然后向后移动，反之亦然。我试图用数组来完成这项工作，但它没有响应。它只移动一次，并且无论是向前还是向后单击一次，它都会执行相同的操作。我已经把我的代码粘贴到代码笔中了，请看一下。在这里粘贴代码给我带来了麻烦。 https://codepen.io/anon/pen/JqZPVWfunction goleft(){    imgscroll[0] = document.createElement("imgscl");    imgscroll[1] = document.createElement("imgscl");    imgscroll[2] = document.createElement("imgscl");    for(var index=0 ; index < 3; index++)    {        legendChildNodes[index] = document.getElementById("legends").childNodes[index];        imgscroll[index].src = imgArray[index];    }    if(imgArray[0] == document.getElementById("legends").childNodes[0].src)    {        document.getElementById("legends").replaceChild(imgscroll[1], legendChildNodes[0]);        document.getElementById("legends").replaceChild(imgscroll[2], legendChildNodes[1]);        document.getElementById("legends").replaceChild(imgscroll[0], legendChildNodes[2]);    }    else if (imgArray[0] == document.getElementById("legends").childNodes[1].src)    {        document.getElementById("legends").replaceChild(imgscroll[2], legendChildNodes[0]);        document.getElementById("legends").replaceChild(imgscroll[0], legendChildNodes[1]);        document.getElementById("legends").replaceChild(imgscroll[1], legendChildNodes[2]);    }    else if (imgArray[0] == document.getElementById("legends").childNodes[2].src)    {        document.getElementById("legends").replaceChild(imgscroll[0], legendChildNodes[0]);        document.getElementById("legends").replaceChild(imgscroll[1], legendChildNodes[1]);        document.getElementById("legends").replaceChild(imgscroll[2], legendChildNodes[2]);    }}如果有人能帮我解决这个问题。