点击隐藏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>