js中style.display=""无效的解决方法
本文实例讲述了js中style.display=""无效的解决方法。分享给大家供大家参考。具体解决方法如下:
一、问题描述:
在js中我们有时想动态的控制一个div显示或隐藏或更多的操作,但如果我们style.display=""可能导致没有效果。
看下面一段代码:
#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"可以解决外,还有另外一种办法就是:
My name is smile.
</div>
<script>
document.getElementById('name').style.display="";
</script>
就是把id为name的样式用style这样内置到标签内,这样不管用display=""还是display="block"就都可以正常显示啦!
js中style.display=""无效的解决方法的更多相关文章
- JS中style.display和style.visibility的区别
在JS中可以通过设置style.display或者style.visibility属性来控制元素是否显示,在style.display=block和style.visibility=visible的时 ...
- strtus2中的default-action-ref无效的解决方法
strtus2中的default-action-ref的作用是我们在浏览器中访问错误的地址时可以跳转到自己设置的错误页面,而不是令人尴尬的系统错误页面,这个系统错误很常见,就是提示在namespace ...
- winform中devexpress bindcommand无效的解决方法
正常绑定,编译运行无报错,但无法执行command fluentAPI.BindCommand(commandButton, (x, p) => x.DoSomething(p), x => ...
- Devexpress xaf针对某个用户登录后在面板中设置导航无效的解决方法
Devexpress xaf框架生成的项目默认情况下导航栏是显示在左侧,有时候我们用某个账户登录后,发现导航栏无法显示在左侧,操作十分不方便.我们可以去数据库删除当前登录用户的自定义布局 解决方法如下 ...
- js原生态函数中使用jQuery中的 $(this)无效的解决方法
原文地址:http://www.jb51.net/article/27238.htm 今天遇到一个听郁闷的问题,正如title所说 js中原生态函数在jQuery 中使用 $(this) 被解析成un ...
- Node.js中针对中文的查找和替换无效的解决方法
Node.js中针对中文的查找和替换无效的解决方法. //tags的值: tag,测试,帖子 var pos1 = tags.indexOf("测"); //这里返回-1 ta ...
- WPF:指定的命名连接在配置中找不到、非计划用于 EntityClient 提供程序或者无效的解决方法
文/嶽永鹏 WPF 数据绑定中绑定到ENTITY,如果把数据文件做成一个类库,在UI文件中去应用它,可能遇到下面这种情况. 指定的命名连接在配置中找不到.非计划用于 EntityClient 提供程序 ...
- channelartlist中autoindex无效的解决方法
{dede:channelartlist}中有使用autoindex无效的解决方法 在设计频道首页的时候,使用{dede:channelartlist}标签时,有很多朋友想做一些高级的开发,让重复的频 ...
- 设置height:100%无效的解决方法
设置height:100%无效的解决方法 刚接触网页排版的新手,常出现这种情况:设置table和div的高height="100%"无效,使用CSS来设置height:" ...
随机推荐
- CentOS7安装Docker,运行Nginx镜像、Centos镜像
摘要 总体思路:yum命令直接安装Docker,下载想要的镜像并启动 1.环境,CentOS7 Minimal 64位,Docker必须要64位的系统 2.通过yum命令直接安装,yum instal ...
- 【转载】C++知识库内容精选 尽览所有核心技术点
原文:C++知识库内容精选 尽览所有核心技术点 C++知识库全新发布. 该知识库由C++领域专家.CSDN知名博客专家.资深程序员和项目经理安晓辉(@foruok)绘制C++知识图谱,@wangshu ...
- 验证SMB登入
使用SMB登入扫描器对大量主机的用户名和口令进行猜解,不过扫描动静很大,容易被察觉,而且每一次登入尝试都会被扫描的主机系统日志记录下来,留下痕迹不建议使用. 实例 第一步: msf > use ...
- HDU 5810 Balls and Boxes(盒子与球)
Balls and Boxes(盒子与球) Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/65536 K (Java/O ...
- jQuery:show()方法
show()方法是jQuery的方法,功能是显示元素,参数是时间,单位是毫秒,例如: Html: <div class="one" id="one"> ...
- "npm ERR! Error: EPERM: operation not permitted"问题解决
在基于macaca进行自动化测试的时候,遇到如下问题: E:\AutoTest\Macaca\LocalTEST\macaca-test-sample\macaca-test>macaca do ...
- JavaScript中的加法运算
<head runat="server"> <title>JavaScript实现加法计算器</title> <script type=& ...
- 自定义表单input
我想实现下面这个效果?应该怎么写最方便呢?最有效,兼容性最好呢 我使用<p>标签套lable,加input的组合,p标签绝对定位,input标签铺满,用padding填充. 主要css . ...
- Nginx基础知识之————日志管理
一.Server段,可以看到如下类似信息 #access_log logs/host.access.log main; 说明该server, 它的访问日志的文件是 logs/host.access. ...
- ERROR 1044 (42000): Access denied for user ''@'localhost' to database 'db'
1.问题 在刚刚安装MySQL之后,进入到mysql环境下,创建数据库,出现下面的提示信息: ERROR 1044 (42000): Access denied for user ''@'localh ...