<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body style = "text-align:center">
<div style = "text-align:center " >
<h3>下面是浊辅音练习</h3>
<img src="images/pingjia/ks.png" width="400px" height="400px" alt="" id="img" ;>
<p>功能：将顺序打乱 点击按钮 下一步~上一步 展示错乱排列的图片组中的每一张假名</p>
</div>
<button type="button" id="prev">上一张</button>
<button type="button" id="next">下一张</button>
</body>
<script type="text/javascript">
var imgs = document.getElementById("img");
var nextBtn = document.getElementById("next");
var prevBtn = document.getElementById("prev");
var arr = [];
var imgArr = [];
imgArr[0] = "images/pingjia/jy.png";
imgArr[1] = "images/pingjia/02.png";
imgArr[2] = "images/pingjia/03.png";
imgArr[3] = "images/pingjia/04.png";
imgArr[4] = "images/pingjia/05.png";
imgArr[5] = "images/pingjia/06.png";
imgArr[6] = "images/pingjia/07.png";
imgArr[7] = "images/pingjia/08.png";
imgArr[8] = "images/pingjia/09.png";
imgArr[9] = "images/pingjia/10.png";
imgArr[10] = "images/pingjia/11.png";
imgArr[11] = "images/pingjia/12.png";
imgArr[12] = "images/pingjia/13.png";
imgArr[13] = "images/pingjia/14.png";
imgArr[14] = "images/pingjia/15.png";
imgArr[15] = "images/pingjia/16.png";
imgArr[16] = "images/pingjia/17.png";
imgArr[17] = "images/pingjia/18.png";
imgArr[18] = "images/pingjia/19.png";
imgArr[19] = "images/pingjia/20.png";
imgArr[20] = "images/pingjia/21.png";
imgArr[21] = "images/pingjia/22.png";
imgArr[22] = "images/pingjia/23.png";
imgArr[23] = "images/pingjia/24.png";
imgArr[24] = "images/pingjia/25.png";
imgArr[25] = "images/pingjia/26.png";
imgArr[26] = "images/pingjia/27.png";
imgArr[27] = "images/pingjia/28.png";
imgArr[28] = "images/pingjia/29.png";
imgArr[29] = "images/pingjia/30.png";
imgArr[30] = "images/pingjia/31.png";
imgArr[31] = "images/pingjia/32.png";
imgArr[32] = "images/pingjia/33.png";
imgArr[33] = "images/pingjia/34.png";
imgArr[34] = "images/pingjia/35.png";
imgArr[35] = "images/pingjia/36.png";
imgArr[36] = "images/pingjia/37.png";
imgArr[37] = "images/pingjia/38.png";
imgArr[38] = "images/pingjia/39.png";
imgArr[39] = "images/pingjia/40.png";
imgArr[40] = "images/pingjia/41.png";
imgArr[41] = "images/pingjia/42.png";
imgArr[42] = "images/pingjia/43.png";
imgArr[43] = "images/pingjia/44.png";
imgArr[44] = "images/pingjia/45.png";
imgArr[45] = "images/pingjia/46.png";
imgArr[46] = "images/pingjia/47.png";
imgArr[47] = "images/pingjia/48.png";
imgArr[48] = "images/pingjia/49.png";
imgArr[49] = "images/pingjia/50.png";
imgArr[50] = "images/pingjia/01.png";
imgArr[51] = "images/pingjia/zsh.png";
var length = imgArr.length,
randomIndex,
temp;
while (length) {
randomIndex = Math.floor(Math.random() * (length--));
temp = imgArr[randomIndex];
imgArr[randomIndex] = imgArr[length];
imgArr[length] = temp
}
var index = 0;
nextBtn.onclick = function() {
index++;
console.log(index);
if (index > imgArr.length - 1) {
index = 0;
}
imgs.setAttribute("src", imgArr[index]);
}
prevBtn.onclick = function() {
index--;
console.log(index);
if (index < 0) {
index = imgArr.length - 1;
}
imgs.setAttribute("src", imgArr[index]);
}
</script>
</html>
日语浊辅音练习html本地版
需积分: 5 17 浏览量
2022-06-26
10:00:36
上传
评论
收藏 193KB RAR 举报
日语浊辅音练习网页版.rar （54个子文件） 
HTML1.html 4KB
images pingjia 
13.png 3KB 09.png 4KB 18.png 4KB jy.png 6KB 03.png 3KB 44.png 3KB 28.png 3KB 08.png 4KB 47.png 3KB 11.png 4KB 33.png 3KB 37.png 4KB 45.png 4KB 23.png 3KB 06.png 4KB 40.png 3KB ks.png 7KB zsh.png 7KB 43.png 3KB 21.png 4KB 01.png 4KB 17.png 4KB 39.png 3KB 49.png 3KB 26.png 4KB 24.png 4KB 38.png 3KB 29.png 4KB 19.png 3KB 35.png 3KB 31.png 4KB 50.png 4KB 27.png 4KB 32.png 3KB 25.png 5KB 14.png 3KB 46.png 3KB 34.png 3KB 16.png 4KB 10.png 4KB 05.png 3KB 12.png 4KB 30.png 3KB 41.png 3KB 36.png 4KB 22.png 4KB 07.png 3KB 48.png 3KB 04.png 4KB 20.png 5KB 42.png 2KB 15.png 3KB 02.png 4KB pianjia 
评论0