图片切换效果
<body>
<div id="box">
<img src="image/image1.jpg" id="tu">
</div>
<button id="prev">上一页</button>
<button id="next">下一页</button>
</body>
js
main = function(){ //获取节点 var tu = document.getElementById("tu"); var next = document.getElementById(‘next‘); var prev = document.getElementById(‘prev‘); var min=1,max=4,cont = min; next.onclick = function(){ cont++; if(cont>max) { cont = min; } console.log(‘image/image‘+cont+‘.jpg‘); tu.setAttribute(‘src‘,‘image/image‘+cont+‘.jpg‘); } prev.onclick = function(){ cont--; if(cont<min) { cont = max; } console.log(‘image/image‘+cont+‘.jpg‘); tu.setAttribute(‘src‘,‘image/image‘+cont+‘.jpg‘); } } window.onload = main;
原文:https://www.cnblogs.com/wocaonidaye/p/12939923.html