javascript - 使用 javascript 将图像替换为 alt 文本

Question

到目前为止，我发现了如何用 html 页面上的另一个元素替换元素。但是我的功能以一种奇怪的方式工作。首先它替换了第一张和第三张图片。如果我再次调用它，它只会替换第二个图像。再次按下按钮，最后最后的第四张图像被替换。有人对此有任何想法吗？这是源代码：http ://pastie.org/5502630 在这里你可以看到它是如何工作的：http ://clubnights.square7.ch/webtech/a2.html

Answer 1

您正在修改图像列表，因为您正在迭代它。因此，当您尝试访问图像数组时，它不是您认为的那样！下面是一个可能的解决方法..

    function Convert()
    {
            images = window.document.getElementsByTagName('img');
            var num_images = images.length;
            for (var i = 0; i < num_images; i++)
            {
                    var image = images[0];
                    textReplacement = document.createTextNode(image.getAttribute('alt'));
                    image.parentNode.replaceChild(textReplacement, image);
            }
    }

Answer 2

每次通过循环时，您都会从数组for中删除第一个图像。images[]这将更改数组内容和设置为循环中条件的数组长度。

例如，您通过 removes 的第一个循环images[0]， ausdruck_1.gif - 但现在 images.length 等于 3，而不是 4，并且数组的内容现在是：

images[0]=ausdruck_2.gif
images[1]=ausdruck_3.gif
images[2]=ausdurck_4.gif

您通过循环的第二次删除images[1]- 现在是 ausdruck_3.gif - 并进一步将图像数组的长度更改为 2，因此 i 到 2 的下一个增量会导致循环退出。

我创建了一个jsfiddle，显示了将 for 语句更改为的可能解决方案：

for(i = images.length-1; i >=0; i--)

并以相反的顺序循环播放图像。