谁讲讲这个图片切换效果流程没看懂源代码

<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>无标题文档</title> <script> window.onload = function () { var oImg = document.getElementById('img1'); var arr = ['img/1.jpg', 'img/2.jpg', 'img/3.jpg', 'img/4.jpg']; var num = 0; oImg.onclick = function () { // num = num + 2; // num += 2; num++; if (num == arr.length) { num = 0; } // alert( arr[num] ); oImg.src = arr[num]; }; }; </script> </head> <body> <img id="img1" src="img/1.jpg" width="400" height="400" /> </body> </html>

<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>无标题文档</title> <script> window.onload = function () { //获取图片 var oImg = document.getElementById('img1'); //将 4个图片的地址 src 放入数组arr 中,从1到4,分别对应下标0-3 var arr = ['img/1.jpg', 'img/2.jpg', 'img/3.jpg', 'img/4.jpg']; //记录下标 var num = 0; //点击事件 oImg.onclick = function () { //每点击一次,下标加1 num++; //当 num = 4时,将0赋值为 num, 从头开始 if (num == arr.length) { num = 0; } //将img/1.jpg-img/4.jpg赋值给 img 的 src oImg.src = arr[num]; }; }; </script> </head> <body> <img id="img1" src="img/1.jpg" width="400" height="400" /> </body> </html>

谁讲讲这个图片切换效果流程没看懂源代码

1回答