使用javascript的图像替换循环

因此，我正在学习W3上的图像替换技术，以下是我想要的：

有一个狗的形象

当我点击这张图片时，这张图片将被一只猫的图片所取代

但是，如果我再次单击此图像，它将再次被之前的狗替换 原来在那里

如果我再按一下，猫就会代替狗

等等

我如何做一个永久的循环来替换这两个图像

这里有一个与我想做的类似的链接：

在该示例中，如果单击该图像，它将替换该图像一次。但是如果你再次点击它，原始图像将不会替换它

---

是的，任何关于制作一个高效算法的帮助都将得到极大的赞赏，该算法可以不断地用新图像替换原始图像。

将图像放入一个数组中，并使用一个变量跟踪下一个要显示的图像：

var images = ["hackanm.gif", "compman.gif"];
var index = 0;

function changeSrc() {
  document.getElementById("myImage").src = images[index];
  index = (index + 1) % images.length;
}

试试这个

<img id="img" src="cat.jpg" />​

这是工作演示

$('#img').toggle(
    function(){
        $(this).attr('src', 'dog.jpg');
    },
    function(){
        $(this).attr('src', 'cat.jpg');
    }
);​