DOM操作相册案例

5月8号作业

//仿照相册案例，写一个小案例，介绍一下你的家乡
一、仿相册案例的知识点
<script>
var pic =document.querySelectorAll('img')[0];  //pic就是第一个<img>
 var Info=document.getElementById('info');    //Info就是第一个<p>
 var obj =document.getElementsByTagName('a');  //找到当前所有的<a>
for (var i=0;i<obj.length;i++) {          //循环，因为不止一个<a>
    obj[i].onclick=function(){                     //某个点击事件
    for (var i=0;i<obj.length;i++) {            //循环去除所有的class（.active）
       obj[i].classList.remove('active');
        }
    this.classList.add('active');//或者this.className='active'   //给当前的a添加class（.active）
    pic.src=this.href;      //根据a的href改变src
    Info.innerHTML='<span style="color: coral">'+this.innerText+'：'+this.title+'</span>';
    return false     //禁止a链接新窗口打开
    }
 }
 </script>
-------------------------------------------------------------------------------------------------------