怎样用js改变图片路径?

JavaScript03

怎样用js改变图片路径?,第1张

<script>

function aa(h)

{

if (h==1)

{document.all.img1.src="images/22.jpg"}

if (h==2)

{document.all.img1.src="images/5.jpg"}

}

</script>

<img src="images/5.jpg" onClick="aa(1)" id="img1">

<img src="images/22.jpg" onClick="aa(2)" id="img2">

用js来修改图片路径实现轮播是不太可取的一种办法,通常的做法是:

把需要轮播的图片全部罗列出来,用js控制轮流显示第几张图片,

EX:

html代码:

<div id="lunbo">

<div id="img1" class="img"><img src="**"></div>

<div id="img2" class="img"><img src="**"></div>

<div id="img3" class="img"><img src="**"></div>

</div>

css代码:

#lunbo{width:100%height:300pxposition:relativezoom:1overflow:hidden}

#lunbo div{width:100%height:100%position:absoluteleft:0top:0display:none}

#lunbo div:first-child{display:block}

img{width:100%height:100%border:0display:block}

js代码:

<script type="text/javascript">

var t=0

setInterval(function(){

t++

if(t>2)t=0

document.querySelector(".img").style.display="none"

document.querySelector("#img"+t.toString()).style.display="block"

},5000)

</script>