本文实例讲述了js中style.display=""无效的解决方法。分享给大家供大家参考。具体解决方法如下：

一、问题描述：

在js中我们有时想动态的控制一个div显示或隐藏或更多的操作，但如果我们style.display=""可能导致没有效果。

看下面一段代码：

复制代码代码如下:
<style>
 #name
 {
     display:none;
 }
</style>
</head>
<body>
<div id="name" >
My name is smile.
</div>
</body>
</html>
<script>
window.onload=function(){
document.getElementById('name').style.display="";
 alert("test");
}
</script>

css定义了id为name的div为隐藏，而我们在页面加载完成之后用js控制该id显示出来，这样写有错么？
木有错？可是为什么界面上还是空白呢？

二、解决方法：

记得还有一个用法是xxx.style.display="block" 那我们试试吧，
呜呼，竟然显示了！！！

那我们查看一下style.display=""和style.display="block"用法有什么不同吧。
其实，这两个的最大区别是block是块显示的，所以会换行，那么既然就这么点区别，为什么在本例子中一个可以显示，一个不行呢?困扰。
好吧，这个问题先放开，我们先看现在这个问题中我们如何解决，除了用style.display="block"可以解决外，还有另外一种办法就是：

复制代码代码如下:
<div id="name" style="display:none" >
My name is smile.
</div>
<script>
     document.getElementById('name').style.display="";
</script>

就是把id为name的样式用style这样内置到标签内，这样不管用display=""还是display="block"就都可以正常显示啦!

js中style.display=""无效的解决方法的更多相关文章

  1. JS中style.display和style.visibility的区别

    在JS中可以通过设置style.display或者style.visibility属性来控制元素是否显示,在style.display=block和style.visibility=visible的时 ...

  2. strtus2中的default-action-ref无效的解决方法

    strtus2中的default-action-ref的作用是我们在浏览器中访问错误的地址时可以跳转到自己设置的错误页面,而不是令人尴尬的系统错误页面,这个系统错误很常见,就是提示在namespace ...

  3. winform中devexpress bindcommand无效的解决方法

    正常绑定,编译运行无报错,但无法执行command fluentAPI.BindCommand(commandButton, (x, p) => x.DoSomething(p), x => ...

  4. Devexpress xaf针对某个用户登录后在面板中设置导航无效的解决方法

    Devexpress xaf框架生成的项目默认情况下导航栏是显示在左侧,有时候我们用某个账户登录后,发现导航栏无法显示在左侧,操作十分不方便.我们可以去数据库删除当前登录用户的自定义布局 解决方法如下 ...

  5. js原生态函数中使用jQuery中的 $(this)无效的解决方法

    原文地址:http://www.jb51.net/article/27238.htm 今天遇到一个听郁闷的问题,正如title所说 js中原生态函数在jQuery 中使用 $(this) 被解析成un ...

  6. Node.js中针对中文的查找和替换无效的解决方法

    Node.js中针对中文的查找和替换无效的解决方法.   //tags的值: tag,测试,帖子 var pos1 = tags.indexOf("测"); //这里返回-1 ta ...

  7. WPF：指定的命名连接在配置中找不到、非计划用于 EntityClient 提供程序或者无效的解决方法

    文/嶽永鹏 WPF 数据绑定中绑定到ENTITY,如果把数据文件做成一个类库,在UI文件中去应用它,可能遇到下面这种情况. 指定的命名连接在配置中找不到.非计划用于 EntityClient 提供程序 ...

  8. channelartlist中autoindex无效的解决方法

    {dede:channelartlist}中有使用autoindex无效的解决方法 在设计频道首页的时候,使用{dede:channelartlist}标签时,有很多朋友想做一些高级的开发,让重复的频 ...

  9. 设置height:100%无效的解决方法

    设置height:100%无效的解决方法 刚接触网页排版的新手,常出现这种情况:设置table和div的高height="100%"无效,使用CSS来设置height:" ...

随机推荐

  1. Jetty和Tomcat的选择：按场景而定

    Jetty和Tomcat的选择:按场景而定 Jetty和Tomcat为目前全球范围内最著名的两款开源的webserver/servlet容器.由于它们的实现都遵循Java Servlet规范,一个Ja ...

  2. JAVA常用数据结构及原理分析

    JAVA常用数据结构及原理分析 http://www.2cto.com/kf/201506/412305.html 前不久面试官让我说一下怎么理解java数据结构框架,之前也看过部分源码,balaba ...

  3. 关于htons和htonl

    htons的功能:将一个无符号短整型数值转换为网络字节序,即大端模式(big-endian) 参数u_short hostshort: 16位无符号整数 返回值:TCP / IP网络字节顺序. hto ...

  4. c++中char*\wchar_t*\string\wstring之间的相互转换

    string U2A(const wstring& str)//Unicode字符转Ascii字符 { string strDes; if ( str.empty() ) goto __end ...

  5. Java程序员必备的6款最佳开发工具

    工欲善其事,必先利其器.每一个Java程序员都有其惯用的工具组件.对于Java程序员,各种有用的软件和工具泛滥成灾.初级开发人员要么找不到合适的工具,要么在寻找过程中浪费了大量的时间.下面,我将为大家 ...

  6. Cacti中文版在Centos上的安装

    最近老有人问Cacti中文版在哪下载啊怎么安装啊,我在这里一遍给大家讲解了:Cacti中文版在Centos上的安装 1.基本安装 cacti是运作在apache+php+mysql+net-snmp工 ...

  7. SVN Unable to connect to a repository at URL问题解决

    图1 之前用的好好的,不知道为什么今天就不行了,根据网上给的方法TortoiseSVN -> Settings -> Saved Data,点击个个"Clear"按钮, ...

  8. sql 语句 嵌套子查询 执行顺序分析

    --创建测试数据create table Student(S# varchar(10),Sname nvarchar(10),Sage datetime,Ssex nvarchar(10))inser ...

  9. CUBRID学习笔记 39 net使用dataset 返回查询的数据

    using CUBRID.Data.CUBRIDClient;    namespace DataSetExample {     class Program     {         static ...

  10. yii::app(); 怎么得到module、controller、action的名字

    $module = Yii::app()->controller->module->id; $controller = Yii::app()->controller->i ...