javascript를 사용하여 대체 텍스트로 이미지 바꾸기

Question

html 페이지의 다른 요소로 요소를 대체하는 방법을 지금까지 발견했습니다. 하지만 제 기능이 이상하게 작동하고 있습니다. 먼저 첫 번째와 세 번째 이미지를 대체합니다. 다시 호출하면 두 번째 이미지 만 바뀝니다. 버튼을 다시 누르면 마침내 마지막 네 번째 이미지가 바뀝니다. 그것에 대해 어떤 아이디어가 있습니까? 여기에 소스가 있습니다 : http://pastie.org/5502630 그리고 어떻게 작동하는지 볼 수 있습니다 : http://clubnights.square7.ch/webtech/a2.html

Answer 1

가능한 대안이다. 이렇게하면 배열 내용과 배열 길이가 루프의 조건부로 변경됩니다. 예를 들어

를 통해 첫 번째 루프는 images[0], ausdruck_1.gif 제거 -하지만 지금 images.length하지 4, 3과 동일하고, 배열의 내용은 지금 : 통해

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

두 번째 패스 루프는 images[1] - 이제 ausdruck_3.gif -을 제거하고 이미지 배열의 길이를 2로 변경하므로 i의 다음 증분이 2가되어 루프가 종료됩니다.

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

와 역순으로 이미지를 반복 :

나는에 문을 위해 변화의 가능한 솔루션을 보여주는 jsfiddle를 만들었습니다.

Answer 2

이미지를 반복하면서 수정하고 있습니다. 따라서 이미지 배열에 액세스하려고하면 생각하는 것이 아닙니다! 아래 for 루프를 통해, 사용자가 images[] 배열에서 첫 번째 이미지를 삭제 패스 .. 각각

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