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区别的更多相关文章

  1. display:none与visible:hidden的区别 slideDown与

    display:none与visible:hidden的区别 display:none和visible:hidden都能把网页上某个元素隐藏起来,但两者有区别: display:none ---不为被 ...

  2. display:none与visible:hidden的区别

    display:none和visible:hidden都能把网页上某个元素隐藏起来,但两者有区别: display:none ---不为被隐藏的对象保留其物理空间,即该对象在页面上彻底消失,通俗来说就 ...

  3. Readonly和disabled的区别 display:none和visible:hidden的区别

    怎样使input中的内容为只读,也就是说不让用户更改里面的内容. <input type="text" name="input1" value=" ...

  4. display:none和visible:hidden两者的区别

    display:none和visible:hidden都能把网页上某个元素隐藏起来,但两者有区别:display:none ---不为被隐藏的对象保留其物理空间,即该对象在页面上彻底消失,通俗来说就是 ...

  5. display:none和visibility:hidden区别

    <!-- display:none和visible:hidden都能把网页上某个元素隐藏起来,但两者有区别: --> <!-- display:none 不为被隐藏的对象保留其物理空 ...

  6. 【javascript】jq之display:none与visible:hidden

    今天学习到jquery的hide()部分时,突然有一个想法,jquery中的隐藏/显示部分的实现是给目标元素附加一个"display: none"属性,那么如果在类似于下面的布局中 ...

  7. jq之display:none与visible:hidden

    http://www.cnblogs.com/linxiong945/p/4075146.html 今天学习到jquery的hide()部分时,突然有一个想法,jquery中的隐藏/显示部分的实现是给 ...

  8. CSS display:none和visibility:hidden区别

    你知道CSSdisplay:none和visibility:hidden的区别吗,这里和大家分享一下,使用CSS display:none属性后,HTML元素(对象)的宽度.高度等各种属性值都将&qu ...

  9. CSS样式“display:none”与“visibility:hidden”区别

    CSS样式“display:none”和“visibility:hidden”都可以实现将页面元素隐藏,但是具体的效果是有差别的!下面通过两个小实验来说明这种差异. 实验代码: <!DOCTYP ...

随机推荐

  1. POJ 1088 滑雪 (记忆化搜索)

    题目链接:http://poj.org/problem?id=1088 题意很好懂,就是让你求一个最长下降路线的长度. dp[i][j]记录的是i j这个位置的最优的长度,然后转移方程是dp[i][j ...

  2. Unity3D之Mecanim动画系统学习笔记(四):Animation State

    动画的设置 我们先看看Animation Clip的一些设置: Loop time:动画是否循环播放. 下面出现了3个大致一样的选项: Root Transform Rotation:表示为播放动画的 ...

  3. 一次线上OOM故障排查经过

    转贴:http://my.oschina.net/flashsword/blog/205266 本文是一次线上OOM故障排查的经过,内容比较基础但是真实,主要是记录一下,没有OOM排查经验的同学也可以 ...

  4. Flex “跑马灯”效果(自定义“跑马灯”控件)

    自定义类(BroadCastMarquee.as): package marquee { import flash.events.MouseEvent; import flash.events.Tim ...

  5. 利用procdump+Mimikatz 绕过杀软获取Windows明文密码(转)

    Mimikatz现在已经内置在Metasploit’s meterpreter里面,我们可以通过meterpreter下载.但是你如果觉得还要考虑杀毒软件,绑定payload之类的东西太过复杂,我们可 ...

  6. PostgreSQL的 initdb 源代码分析之二十三

    继续分析: vacuum_db(); 展开: cmd是:/home/pgsql/project/bin/postgres" --single -F -O -c search_path=pg_ ...

  7. 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 ...

  8. 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 ...

  9. 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 ...

  10. OpenGL入门学习(转)

    OpenGL入门学习 http://www.cppblog.com/doing5552/archive/2009/01/08/71532.html 说起编程作图,大概还有很多人想起TC的#includ ...