display:none与visible:hidden区别
if(list.style.display=='none'){
list.style.display='block';
}else{
list.style.display='none';
}
这里的none是查询不到的
alert(list.style.display)为空值,加了display:none的元素师从文档流中删除了,所以查询不到,
这里要换个思路
if(list.style.display!='block'){
list.style.display='block';
}else{
list.style.display='none';
}
这样就可以了。
display:none与visible:hidden区别在于 前者是从文档中删除,占据的空间也随之消失,而后者仅仅是隐藏,不会去除所占据的空间,。
在占据空间上,absolute与relative情况和上面相似
感谢学妹(Adeline)的科普。
display:none与visible:hidden区别的更多相关文章
- display:none与visible:hidden的区别 slideDown与
display:none与visible:hidden的区别 display:none和visible:hidden都能把网页上某个元素隐藏起来,但两者有区别: display:none ---不为被 ...
- display:none与visible:hidden的区别
display:none和visible:hidden都能把网页上某个元素隐藏起来,但两者有区别: display:none ---不为被隐藏的对象保留其物理空间,即该对象在页面上彻底消失,通俗来说就 ...
- Readonly和disabled的区别 display:none和visible:hidden的区别
怎样使input中的内容为只读,也就是说不让用户更改里面的内容. <input type="text" name="input1" value=" ...
- display:none和visible:hidden两者的区别
display:none和visible:hidden都能把网页上某个元素隐藏起来,但两者有区别:display:none ---不为被隐藏的对象保留其物理空间,即该对象在页面上彻底消失,通俗来说就是 ...
- display:none和visibility:hidden区别
<!-- display:none和visible:hidden都能把网页上某个元素隐藏起来,但两者有区别: --> <!-- display:none 不为被隐藏的对象保留其物理空 ...
- 【javascript】jq之display:none与visible:hidden
今天学习到jquery的hide()部分时,突然有一个想法,jquery中的隐藏/显示部分的实现是给目标元素附加一个"display: none"属性,那么如果在类似于下面的布局中 ...
- jq之display:none与visible:hidden
http://www.cnblogs.com/linxiong945/p/4075146.html 今天学习到jquery的hide()部分时,突然有一个想法,jquery中的隐藏/显示部分的实现是给 ...
- CSS display:none和visibility:hidden区别
你知道CSSdisplay:none和visibility:hidden的区别吗,这里和大家分享一下,使用CSS display:none属性后,HTML元素(对象)的宽度.高度等各种属性值都将&qu ...
- CSS样式“display:none”与“visibility:hidden”区别
CSS样式“display:none”和“visibility:hidden”都可以实现将页面元素隐藏,但是具体的效果是有差别的!下面通过两个小实验来说明这种差异. 实验代码: <!DOCTYP ...
随机推荐
- Educational Codeforces Round 1(D. Igor In the Museum) (BFS+离线访问)
题目链接:http://codeforces.com/problemset/problem/598/D 题意是 给你一张行为n宽为m的图 k个询问点 ,求每个寻问点所在的封闭的一个上下左右连接的块所能 ...
- Unity3D之UGUI学习笔记(一):UGUI介绍以及Canvas
UGUI是Unity3D4.6官方提供的UI系统,支持2D和3D UI的开发. Unity3D UI史 OnGUI 在Unity4.6之前,官方提供的是OnGUI函数来开发UI界面,当然问题也比较多, ...
- Lua学习笔记(二):基本语法
Lua学习指南:http://www.lua.org/manual/ 首先我们要明确的一点是:在Lua中,除了关键字外一切都是变量. Lua关键字 可以查看这个地址:http://www.lua.or ...
- 让div变得大方美观 bootstrap
<div class="panel panel-default "> <div class="panel-heading"> <h ...
- mount nfs的可选参数
mount nfs的可选参数:HARD mount和SOFT MOUNT:HARD:NFS CLIENT会不断的尝试与SERVER的连接(在后台,不会给出任何提示信息,在LINUX下有的版本仍然会给出 ...
- HDOJ 1151 Air Raid
最小点覆盖 Air Raid Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others) T ...
- 关于.net中线程原子性的自我总结
首先来张图,一张 cpu的简图,仅从个人理解角度理解画的 大体 解释下这张图 这是 一张 i5的简图i5 大家都知道 是双核四线程,(超线程技术)l1,l2,l3是 1,2,3级缓存. Cpu工作:每 ...
- MySQL安装详解(V5.5 For Windows)
前言 这几年一直在用MySQL,并且是Windows+.Net+MySQL的搭配,用MyISAM引擎支持过单表每天千万以上的数据递增,TB级的数据MySQL游刃有余.最近在做一个较大并发的项目,尝试了 ...
- mbstowcs_s实现wchar_t转成char
把char*转换为wchar_t* 用stdlib.h中的mbstowcs_s函数,可以通过下面的例子了解其用法: char*CStr = "string to convert"; ...
- thrift学习笔记
Thrift学习笔记 一:thrift介绍 Thrift是facebook开发的用来处理各不同系统之间数据通讯的rpc服务框架,后来成为apche的开源项目.thrift支持多种程序语言,包括Java ...