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 ...
随机推荐
- POJ 1088 滑雪 (记忆化搜索)
题目链接:http://poj.org/problem?id=1088 题意很好懂,就是让你求一个最长下降路线的长度. dp[i][j]记录的是i j这个位置的最优的长度,然后转移方程是dp[i][j ...
- Unity3D之Mecanim动画系统学习笔记(四):Animation State
动画的设置 我们先看看Animation Clip的一些设置: Loop time:动画是否循环播放. 下面出现了3个大致一样的选项: Root Transform Rotation:表示为播放动画的 ...
- 一次线上OOM故障排查经过
转贴:http://my.oschina.net/flashsword/blog/205266 本文是一次线上OOM故障排查的经过,内容比较基础但是真实,主要是记录一下,没有OOM排查经验的同学也可以 ...
- Flex “跑马灯”效果(自定义“跑马灯”控件)
自定义类(BroadCastMarquee.as): package marquee { import flash.events.MouseEvent; import flash.events.Tim ...
- 利用procdump+Mimikatz 绕过杀软获取Windows明文密码(转)
Mimikatz现在已经内置在Metasploit’s meterpreter里面,我们可以通过meterpreter下载.但是你如果觉得还要考虑杀毒软件,绑定payload之类的东西太过复杂,我们可 ...
- PostgreSQL的 initdb 源代码分析之二十三
继续分析: vacuum_db(); 展开: cmd是:/home/pgsql/project/bin/postgres" --single -F -O -c search_path=pg_ ...
- Codeforces Round #172 (Div. 2) B. Nearest Fraction 二分
B. Nearest Fraction Time Limit: 20 Sec Memory Limit: 256 MB 题目连接 http://codeforces.com/contest/281/p ...
- Codeforces Round #192 (Div. 1) B. Biridian Forest 暴力bfs
B. Biridian Forest Time Limit: 20 Sec Memory Limit: 256 MB 题目连接 http://codeforces.com/contest/329/pr ...
- Codeforces Round #313 (Div. 2) A. Currency System in Geraldion 水题
A. Currency System in Geraldion Time Limit: 20 Sec Memory Limit: 256 MB 题目连接 http://codeforces.com/c ...
- OpenGL入门学习(转)
OpenGL入门学习 http://www.cppblog.com/doing5552/archive/2009/01/08/71532.html 说起编程作图,大概还有很多人想起TC的#includ ...