JS隐藏显示控制div

javascript 控制 html元素 显示/隐藏

1。编写js函数

<script type=”text/javascript”>

   function display(id){

      var traget=document.getElementById(id);
       if(traget.style.display==”none”){
                traget.style.display=””;
       }else{
               traget.style.display=”none”;
    }
   }
</script>

2. 要显示/隐藏的html元素加上 id 属性

<table>

   <tr id=”menu” >   

      <td>控制这个tr的显示/隐藏</td>

</tr>

</table>

3，添加按钮，链接等触发 js 函数

<input type=”button” onclick=”display(‘menu’)” value=”显示/隐藏”/>

<a href=”#” onclick=”display(‘menu’)” >显示/隐藏</a>

javascript隐藏/显示表单对象

javascript隐藏/显示表单对象

[SCRIPT language=JavaScript]
function expandIt(el) {
     whichEl =document.getElementById(el)
     if (whichEl.style.display == ‘none’) {
      whichEl.style.display = ”;
     }
     else {
      whichEl.style.display = ‘none’;
     }
     }
  
[/SCRIPT]

el是对象的id，不管是tr或者table等等先设置一下id，然后进行调用。

例：

[a onclick=”expandIt(‘ttchild’); return false” href=”#” ]try it[/a]

[tr id=”ttchild”][td width=”18″]Example[/td][/tr]

使用时把[]变成<>

javascript控制页面控件隐藏显示的两种方法

javascript控制页面控件隐藏显示的两种方法，方法的不同之处在于控件隐藏后是否还在页面上占位
方法一：
document.all[“PanelSMS”].style.visibility=”hidden”;
document.all[“PanelSMS”].style.visibility=”visible”;
方法二：
document.all[“PanelSMS”].style.display=”none”;
document.all[“PanelSMS”].style.display=”inline”;
方法一隐藏后 页面的位置还被控件占用 只是不显示 类似于.net验证控件的Display=Static
方法二隐藏后 页面的位置不被占用 类似于.net验证控件的Display=Dynamic

[quote]

<a href=”#” onclick=”document.getElementById(this.id+’src’).style.display=document.getElementById (this.id+’src’).style.display==’block’?’none’:’block’;this.innerText=this.innerText ==’显示’?’隐藏’:’显示’;return false;” id=”els” title=”显示内容”>隐藏</a><br>
<span id=”elssrc” style=”display:’block'”>
<pre><p>
一二三四五六七八九十
一二三四五六七八九十
一二三四五六七八九十
一二三四五六七八九十
一二三四五六七八九十
一二三四五六七八九十
一二三四五六七八九十
一二三四五六七八九十
一二三四五六七八九十
一二三四五六七八九十
一二三四五六七八九十
</p></pre>
</span>
<pre><p>
效果就是这样了
效果就是这样了
效果就是这样了

效果就是这样了
效果就是这样了
</p></pre>