点击隐藏js效果

来源:互联网 发布:淘宝联盟的结算时间 编辑:程序博客网 时间:2024/04/27 14:20
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><title>runcode</title><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><meta name="Author" content="Sheneyan" /><script type="text/javascript">var lastFaqClick=null;//上次点击的faqwindow.onload=function(){  var faq=document.getElementById("faq");  var dls=faq.getElementsByTagName("dl");  for (var i=0,dl;dl=dls[i];i++){    var dt=dl.getElementsByTagName("dt")[0];//取得标题     dt.id = "faq_dt_"+(Math.random()*100);     dt.onclick=function(){       var p=this.parentNode;//取得父节点        if (lastFaqClick!=null&&lastFaqClick.id!=this.id){          var dds=lastFaqClick.parentNode.getElementsByTagName("dd");          for (var i=0,dd;dd=dds[i];i++)            dd.style.display='none';        }        lastFaqClick=this;        var dds=p.getElementsByTagName("dd");//取得该父节点所有的子节点,也就是所有的答案        var tmpDisplay='none';        if (gs(dds[0],'display')=='none')          tmpDisplay='block';        for (var i=0;i<dds.length;i++)          dds[i].style.display=tmpDisplay;      }  }}/***取得元素的真实css属性*written in 06.7 sheneyan*/function gs(d,a){  if (d.currentStyle){     var curVal=d.currentStyle[a]  }else{     var curVal=document.defaultView.getComputedStyle(d, null)[a]  }   return curVal;}</script><style type="text/css">*,html,body{margin:0;padding:0}#faq dt{font-weight:bold;cursor:pointer}#faq dd{display:none;}</style></head><body><ul id="faq"><li><dl><dt>问题1 </dt><dd>答:1 </dd></dl></li><li><dl><dt>问题2 </dt><dd>答:2 </dd></dl></li><li><dl><dt>问题3 </dt><dd>答:3 </dd></dl></li><li><dl><dt>问题4 </dt><dd>答:4 </dd></dl></li></li></ul><p><a href="http://www.lanrentuku.com" target="_blank">懒人图库</a></p></body></html>

原创粉丝点击