js基础练习---点击小图换大图

<script type="text/javascript">
window.onload=function()
{
    var obig=document.getElementById('big').getElementsByTagName('img');
    var osmall=document.getElementById('small').getElementsByTagName('img');
    var i=0;
    for(i=0;i<osmall.length;i++)
    {
        osmall[i].onclick=function()
        {
            obig[0].src=this.src;//点击小图获取大图路劲
        };
    };
    
};
</script>

 

<div id="big">
   <img src="示例图片/1.jpg" />
</div>
<div id="small">
    <img src="示例图片/1.jpg" />
    <img src="示例图片/2.jpg" />
    <img src="示例图片/3.jpg" />
    <img src="示例图片/4.jpg" />
</div>

 

 

 

 

 

 

 

转载于:https://www.cnblogs.com/ninali/archive/2013/04/15/3021779.html