复制代码 代码如下:
<script type="text/javascript"> <br>/* window.onload=function() <br>{ <br>var oBtn=document.getElementById('btn1'); <br>var oTxt=document.getElementById('txt1'); <br>var oDiv=document.getElementById('div1'); <br>oBtn.onclick=function() <br>{ <br>oDiv.innerHTML=oTxt.value; <br>} <br><br>}*/ <br>window.onload=function() <br>{ <br>var aLi= document.getElementsByTagName('li'); <br>var Otxt =document.getElementById('tab').getElementsByTagName('div')[0]; <br>var aDats =['元旦1月1日','2月14日情人节','3月3日全国爱耳日', <br>'4月1日愚人节','5月1日国际劳动节','6月1日 国际儿童节', <br>'7月1日中国共产党诞生日','8月1日中国人民解放军建军节','9月10日中国教师节', <br>'10月1日中华人民共和国国庆节','11月9日消防宣传日','12月3日世界残疾人日' <br>]; <br><br>var i=0; <br>for(i=0;i<aLi.length;i++) //for循环历遍li元素 <br>{ <br>aLi[i].index=i; <br>aLi[i].onmouseover =function() //添加鼠标指向事件 <br>{ <br><br>for(i=0;i<aLi.length;i++) //for循环历遍li元素去掉li样式 <br>{ <br>aLi[i].className =''; <br>} <br>this.className ='active'; //给当前标签添加active 样式 <br><br>Otxt.innerHTML ='<h2>'+(this.index+1)+''+'月'+'<p>'+adats[this.index]+''; <br>} <br><br>} <br><br>}; <br><br></script>
效果预览：
