资讯

精准传达 • 有效沟通

从品牌网站建设到网络营销策划，从策略到执行的一站式服务

网站建设 >

查看其它板块

js显示和隐藏DIV的方法

这篇文章主要为大家详细介绍了js显示和隐藏DIV的方法，文中示例代码介绍的非常详细，图文详解容易学习，非常适合初学者入门，感兴趣的小伙伴们可以参考一下。

成都创新互联公司是专业的曲靖网站建设公司，曲靖接单;提供网站设计、网站制作,网页设计,网站设计,建网站,PHP网站建设等专业做网站服务;采用PHP框架,可快速的进行曲靖网站开发网页制作和功能扩展;专业做搜索引擎喜爱的网站,专业的做网站团队,希望更多企业前来合作!

  1.    
  2.    
  3.     
  4.    
  5.    
  6.    
  7.    
  8.    
  9.    
  10.    
  11.    
  12.  
  13.  
  14.  
  15.  
  16.    
  17.     
 
  •    
  • 居中的DIV   
  •    
  •    

    •  

     

    下面是更多参考资料：

     

    1.  
    2.  
    3.  
    4. div隐藏与显示 
    5.  
    6. #menus { 
    7.        background-color: #c4cff0;       
    8.       } 
    9.  
    10.  
    11. function Layer_HideOrShow(cur_div) 
    12. { var current=document.getElementById(cur_div); 
    13.    if(current.style.visibility=="hidden") 
    14.      { 
    15.        current.style.visibility ="visible"; 
    16.      } 
    17.    else 
    18.     { 
    19.       current.style.visibility ="hidden"; 
    20.     } 
    21. } 
    22.  
    23.  
    24.  
    25.  
    26.  
    27.  
    28.     
    29.     
    30.  
    31.  
    32.     
    33.     
    34.      
    35.       
    36.        
    37.       
    38.      
    39.    
     
  •  
  •  
  •  
  •  
  • ==================== 
  •  
  •  
  •  
  • 无标题文档 
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
    •  
  • 居中的DIV 
  •  
  •  
  • ======================= 
  • 3.javascript 控制 html元素 显示/隐藏 
  •  
  • 1。编写js函数 
  •  
  •  
  •  
  •    function display(id){ 
  •  
  •        var traget=document.getElementById(id); 
  •         if(traget.style.display=="none"){ 
  •                 traget.style.display=""; 
  •         }else{ 
  •                 traget.style.display="none"; 
  •       } 
  •    } 
  •  
  •  
  • 2. 要显示/隐藏的html元素加上 id 属性 
  •  
  •  
  •  
  •         
  •  
  •        
    •  
  •  
  •    
    •  
  •  
  • 控制这个tr的显示/隐藏
     
  •  
  • 3，添加按钮，链接等触发 js 函数 
  •  
  •  
  •  
  • 显示/隐藏 
  •  
  • javascript显示隐藏层广告 
  •  
  •  
  •  
  • function 函数{ 
  • if(thisdiv.style.display=='none'){  
  • thisdiv.style.display="" 
  • } 
  • else 
  • thisdiv.style.display="none" 
  • } 
  •  
  • 你先给div 取个ID=“AA”thisdiv=AA 
  •  
  • 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 
  •  
  •  
  •  
  •  
  •  
  • ==================== 
  •  
  • 这个方法来我是从一个boblog模板上找到的，其实网络上也可以搜索到；只是网络上不看效果的转载让人难辩代码的错对和方便。用这个方法比用《给zblog再增3个功能：防刷、收缩侧栏、复制加版权》的效果要好，纯css隐藏div会刷新页面，但用js就不会了。 
  •  
  • 　js代码如下，新建一个txt文件，复制进去，保存并修改文件后缀为js（例open.js）即可。我是把这个文件放在zblog的SCRIPT文件夹里，这里js比较多…… 
  •  
  •  程序代码function showhidediv(id){ 
  •    try{ 
  •      var sbtitle=document.getElementById(id); 
  •      if(sbtitle){ 
  •        if(sbtitle.style.display=='block'){ 
  •          sbtitle.style.display='none'; 
  •        }else{ 
  •          sbtitle.style.display='block'; 
  •        } 
  •      } 
  •    }catch(e){} 

    • 看完上诉内容，你们掌握js显示和隐藏DIV的方法了吗？如果想了解更多相关内容，欢迎关注创新互联行业资讯频道，感谢各位的阅读！


    当前题目：js显示和隐藏DIV的方法
    网站地址：http://cdkjz.cn/article/jsggid.html
    返回首页 了解更多建站资讯

    相关资讯

    多年建站经验

    多一份参考，总有益处

    联系快上网，免费获得专属《策划方案》及报价

    咨询相关问题或预约面谈，可以通过以下方式与我们联系

    大客户专线   成都：13518219792   座机：028-86922220

    在线咨询 提交需求
    友情链接 交换友情链接
    达州网站设计温江电信机房乐山电信机房成都网站制作公司邛崃柴油发电机维修保养公司南充服务器托管德昌麦琪建站四川國際商會成都响应式网站建设品牌网站定制

    成都网站建设公司地址：成都市青羊区太升南路288号锦天国际A座10层 建设咨询028-86922220

    成都快上网科技有限公司-四川网站建设设计公司 | 蜀ICP备19037934号 Copyright 2020,ALL Rights Reserved cdkjz.cn | 成都网站建设 | © Copyright 2020版权所有.

    专家团队为您提供成都网站建设,成都网站设计,成都品牌网站设计,成都营销型网站制作等服务,成都建网站就找快上网！ | 成都网站建设哪家好？ | 网站建设地图