代码如下:
1 for(i=0;i<this.aDiv.length;i++){ 2 this.aDiv[i].index=i; 3 this.aDiv[i].oUl=this.aDiv[i].getElementsByTagName(‘ul‘)[0]; 4 this.aDiv[i].oUl.aA=this.aDiv[i].oUl.getElementsByTagName(‘a‘); 5 this.aDiv[i].onmousedown=function(){ 6 if(this.oUl.display===‘none‘) 7 this.oUl.style.display=‘block‘; 8 else 9 this.oUl.style.display=‘none‘; 10 } 11 }
上面的代码要实现的效果是,党我点击DIV的时候,如果ul是隐藏的,那么显示出来,否则,就隐藏.但是当我点击第一次的时候,它总是没有反应,必须我点击第二次的时候,才能正常工作.
这是因为当我第一次点击的时候,虽然ul在CSS设置里是display:none;但是用if(this.oul.display===‘none‘)并无法获取到display的属性值.只有当我们把display:‘none‘;写在行间样式的时候,才会被识别.
解决办法就是用一个JS函数,去获取计算过后的样式,也就是确切的属性
1
2//obj是要查询的元素,attr是要查询的属性
3function getStyle(obj,attr){ 2 if(obj.currentStyle){//IE 3 return obj.currentStyle[attr]; 4 }else{//ff 5 return getComputedStyle(obj,false)[attr]; 6 } 7 }
这样上面的效果代码应该改为:
1 this.aDiv[i].onmousedown=function(){ 2 if(getStyle(this.oUl,‘display‘)===‘none‘) 3 this.oUl.style.display=‘block‘; 4 else 5 this.oUl.style.display=‘none‘; 6}
原文：http://www.cnblogs.com/zhangfengyang/p/4682165.html