jquery和js对div的隐藏和显示

jQuery对div的显示和隐藏:

显示:

$("#id").show()

隐藏:

$("#id").hide()

js对div的显示和隐藏:

div的visibility可以控制div的显示和隐藏,但是隐藏后页面显示空白

style="visibility: none;"

document.getElementById("typediv1").style.visibility="hidden";//隐藏

document.getElementById("typediv1").style.visibility="visible";//显示

通过设置display属性可以使div隐藏后释放占用的页面空间,如下

style="display: none;"

document.getElementById("typediv1").style.display="none";//隐藏

document.getElementById("typediv1").style.display="";//显示

时间: 2024-10-13 12:17:10

jquery和js对div的隐藏和显示的相关文章

点击按钮对两个div的隐藏与显示进行切换

HTML: <button type="button"  id="showHidden">点击切换div的隐藏与显示</button> <div id="div1">请叫我第一层</div> <div id="div2">请叫我第二层</div> JS: <script type='text/javascript'> function show

js 控制 easyui datagrid 隐藏之后显示不来的问题

最近有的用到easyui的datagrid,有一个这样的需求,就是当触发一个事件之后控制datagrid的显示与隐藏,初始状态是将其datagrid隐藏起来. 说起隐藏datagrid的时候,也遇到了一些问题,关于easyui的datagrid是不可以直接用display这个属性的,那若是想要隐藏这个table,那么就要在它的外面写一个父级div,然后通过控制这个div的隐藏与显示去满足这个需求. <div class="divEditTabKc" style="dis

利用Js/Jquery实现div的隐藏与显示(注意释放与不释放空间)

JS隐藏和显示div的方式有两种:方式1:隐藏后释放占用的页面空间通过设置display属性可以使div隐藏后释放占用的页面空间. style="display: none;" document.getElementById("demo").style.display="none";//隐藏 document.getElementById("demo").style.display="";//显示 方式2:

jquery点击非div区域隐藏div

点击非div区域隐藏div,如图,点击圆的头像(.person-msg)弹出白色底框(.person-centre).点击圆头像以外的区域隐藏白色底框 html代码 <div class="per_c"> <div class="person-msg pull-right"> <img src="../../res/images/snow_man.jpg"> </div> <dl class=

当页面滚动到距顶部一定高度时某DIV自动隐藏和显示、弹窗、垂直居中

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <meta name="viewport" content="width=device-width,initial-scale=1.0, minimum-scale=1.0, maximu

Js - 判断元素是否隐藏、显示

判断元素是否隐藏.显示的方法,需要的朋友可以参考下 : 1.通过判断元素display属性状态值来实现 console.log($('div').css("display"));       // inlineif($('div').css("display") != 'none') { console.log('aaaaa');       // aaaaa $('div').hide();         console.log($('div').css(&qu

前台技术--div的隐藏与显示

怎样使用页面元素隐藏或显示. HTML为我们提供了两个变量visibility和display visibility:隐藏要元素可是元素所暂用的空间不予释放.也就是说元素隐藏了,可是页面上会流出一片空白的地方. 使用方法: style="visibility: hidden;" document.getElementById("typediv1").style.visibility="hidden";//隐藏 document.getElemen

用js控制选项卡的隐藏与显示

通过使用ul和div来,借助于jquery来实现选项卡的显示与隐藏 <form action="" method="post"> <div> <ul> <li><a id="atab1" class="atab">基基基基</a></li> <li><a id="atab2" class="ata

js设置html区域隐藏和显示

1 if(message != "指派") 2 { 3 document.getElementById("appoint").style.display="none"; 4 5 }else{ 6 document.getElementById("appoint").style.display="inline"; 7 } 上面是,javascript代码,下面是html代码: 1 <!-- 选择指派人-