JavaScriptDom节点操作实现切换图片

JavaScriptDom节点操作实现切换图片

作者: 梦飞

乐享生活,分享极致

手机扫码查看

标签:

JavaScript

特别声明:文章多为网络转载,资源使用一般不提供任何帮助,特殊资源除外,如有侵权请联系!

QQ截图20200430144804.jpg

<body>
    <div><img src="images/left.jpg" width="69" height="65" align="absbottom"  id='img1' onClick="fort(-1)" ></div>
    <div> <img src="images/pic1.jpg" width="331" height="161" border="0" id='img2' > </div>
    <div>
        <img id='img3' src="images/right.jpg" width="69" height="65" onClick="fort(1)"></div>
    </div>
</body>
</html>
<script type="text/javascript">
	var i = 1;
	function fort(a){
		var imgs = document.getElementById("img2"); //获取id为img2的节点
		if(a==-1){	//当实参-1传递会函数时执行条件语句
			i--;
			if(i < 1){i=1;}	//图片地址最小值不小于1
			imgs.src='images/pic' + i + '.jpg';
		}else{
			i++;
			if(i > 9){i=9;}	//图片地址最大值不大于9
			imgs.src='images/pic' + i + '.jpg'; 
		}
	}
</script>

 

分享到:
打赏
未经允许不得转载:

作者: 梦飞, 转载或复制请以 超链接形式 并注明出处 梦飞技术博客
原文地址: 《JavaScriptDom节点操作实现切换图片》 发布于2020-4-30

评论

未显示?请点击刷新
切换注册

登录

您也可以使用第三方帐号快捷登录

切换登录

注册

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏