使用JavaScript点击事件切换图片

最新推荐文章于 2022-01-05 22:50:47 发布

owplace

最新推荐文章于 2022-01-05 22:50:47 发布

阅读量4k

点赞数 3

本文链接：https://blog.csdn.net/bafangcio/article/details/80201193

版权

<body>
    <div id="mydiv">
	<img src="img/LIGE.jpg"width="200" height="150" title="我是LIGE"/>
	<img src="img/1480988130963.jpeg" width="200" height="150"title="坐着的"/>
	<img src="img/1480988139204.jpeg" width="200" height="150"title="躺着的"/>
    </div><br />
	<img src="img/4ca14e57fa573bed.jpg" id="dao" width="200" height="150" title="李云龙"/>
	<p id="huan"></p>
</body>

 <script type="text/javascript">
    var mydiv=document.getElementById("mydiv");//获得div里的三张图片
    var myimg=mydiv.getElementsByTagName("img");//获得div的各三张图片 数组
    for(var i=0;i<myimg.length;i++){
        var myimge=document.getElementById("dao");//获得李云龙图片
        var tit=document.getElementById("huan");//获得李云龙文本
        myimg[i].οnclick=function(){
        myimge.src=this.src;//替换图片
        tit.innerText=this.title;//替换文字
           }
        }
</script>

owplace

关注

3
点赞
踩
19

收藏

觉得还不错? 一键收藏
0
评论
使用JavaScript点击事件切换图片

&lt;body&gt; &lt;div id="mydiv"&gt; &lt;img src="img/LIGE.jpg"width="200" height="150" title="我是LIGE"/&gt; &lt;img src="img/1480988130963.jpeg" width="200&qu
复制链接

扫一扫