本文主要介绍利用JS实现简单的图片切换功能。本文中的示例代码非常详细，具有一定的参考价值。感兴趣的朋友可以参考一下。
本文分享使用JS实现简单图片切换的具体代码，供大家参考。具体内容如下
效果如图所示：
分析：
先为按钮添加一个点击响应事件，然后构造函数。其实切换图片就是切换img标签src的属性，可以获取然后修改。
您可以将属性值存储在数组中，并通过数组的索引来获取它们。
附上相关代码：
css代码的一部分：
style type=text/css
*{
边距：0；
填充：0；
}
#a{
边距：50px自动；
宽度：500px
填充：15px
文本对齐：居中；
背景色：# 99FF99
}
/风格
Js代码：
脚本
window.onload=function(){
var Bt n1=document . getelementbyid( Bt n1 )；
var Bt N2=document . getelementbyid( Bt N2 )；
var img=document . getelementsbytagname( img )[0]；
//构建一个数组来存储图片
var imgArr=[img/1.jpg ， img/2.jpg ， img/3.jpg ， img/4.jpg ， img/5.jpg]
var指数=0；
//console . log(src)；
var p=document . getelementbyid( b )；
btn1.onclick=function(){
//alert( 1 )；
//img.src=img/2.jpg
索引-；
if (index0){
index=imgArr.length-1
}
img.src=imgArr[index]
P.innerHTML= of imgArr.length 图片，当前(索引1)图片
};
btn2.onclick=function(){
//alert( 2 )；
指数；
if (index4){
索引=0；
}
img.src=imgArr[index]
P.innerHTML= of imgArr.length 图片，当前(索引1)图片
};
};
/脚本
身体部位：
身体
div id=a
Img src=img/1.jpg alt=冰激凌/
按钮id=btn1 上一个/按钮
Button id=btn2 Next /button
P= b 总共5张图片，当前1张/p
/div
/body
这就是本文的全部内容。希望对大家的学习有帮助，支持我们。
