如何做得到好像msdn中的show example和hide example的效果？

Question

呵呵, 从MSDN里挖出来的源代码:function hideExamples()
{
  var colPre=document.all.tags("PRE");
  for (var i=0;i<colPre.length;i++)
  {
    if (colPre.item(i).className=="clsCode")
    {
      if (colPre.item(i).offsetHeight > 200)
      {
        var oSpan=document.createElement("P");
        colPre.item(i).parentNode.insertBefore(oSpan,colPre.item(i));
        oSpan.onclick=toggle;
        oSpan.ShowHideType="Example"
        oSpan.style.textDecorationUnderline=true;
        oSpan.style.fontWeight="bold";
        oSpan.style.cursor="hand";
        // Code decoration (IE 5 only) will hide the example
        if ( oBD.majorVer < 5 )
        {
          toggle(oSpan);
        }
      }
    }
  }
}

Answer 1

通过设display来控制显示还是隐藏吧

Answer 2

1. <style type="text/css">
    .11{display:none;}
    .22{display:visible;}
   </style>
2. <div id=XX class=22>show the example</div>
3. <div id=YY class=11>hide the example</div>
4. <div id=ZZ class=11>代码的内容</div>
5. 在"show the example"上加事件处理程序,onclick="document.getElementById('XX').className=11;document.getElementById('YY').className=22";document.getElementById('ZZ').className=22"
6. 在"hide the example"上加,onclick="document.getElementById('XX').className=22;document.getElementById('YY').className=11";document.getElementById('ZZ').className=11"试试看.
你可能会有更好的方法!

Answer 3

djbbb(djbbb)的方法可行，我看了一下那个网页的源代码，实现好像是在服务端执行的。直接将源码复制下来运行那个效果就没有了。