本文实例讲述了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.οnlοad=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"就都可以正常显示啦!

转载于:https://www.cnblogs.com/zhangxiaopeng/p/4856138.html

js中style.display=无效的解决方法相关推荐

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

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

  2. 在BIOS中开启vt-x无效的解决方法

    2010年10月10日发布了,ubuntu10.10 ,尝鲜试着安装一下. 32位的windows7,在VirtualBox中创建一个64为的UbuntuServer系统 但是使用VirtualBox ...

  3. ajax异步获取右侧html,Ajax异步获取html数据中包含js方法无效的解决方法

    Ajax异步获取html数据中包含js方法无效的解决方法 页面上使用js写了一个获取后台数据的方法 function data() { var tab = $("#dic") $. ...

  4. cocos2d-js中listView的jumpToBottom()方法无效的解决方法

    cocos2d-js中listView的jumpToBottom()方法无效的解决方法 参考文章: (1)cocos2d-js中listView的jumpToBottom()方法无效的解决方法 (2) ...

  5. PHP中file_exists()判断中文文件名无效的解决方法

    PHP中file_exists()判断中文文件名无效的解决方法 参考文章: (1)PHP中file_exists()判断中文文件名无效的解决方法 (2)https://www.cnblogs.com/ ...

  6. JS IOS/iPhone的Safari浏览器不兼容Javascript中的Date()问题的解决方法

    JS IOS/iPhone的Safari浏览器不兼容Javascript中的Date()问题的解决方法 参考文章: (1)JS IOS/iPhone的Safari浏览器不兼容Javascript中的D ...

  7. 社会化分享bshare代码在网站中的使用（包括https下无效的解决方法）

    一.代码的安装与放置 在bshare中选择好自己喜欢的代码样式之后,将代码复制进网站中 放入代码后,就会出现分享按钮.如果想要关键词和按钮平行显示的话,可利用table进行放置 显示结果如下:乌克兰玛 ...

  8. ci框架中引入css,php ci框架中加载css和js文件失败的原因和解决方法

    php ci框架中加载css和js文件失败的原因和解决方法 发布时间:2021-07-01 12:08:38 来源:亿速云 阅读:50 作者:chen 本篇内容介绍了"php ci框架中加载 ...

  9. 在CSS布局中max-width 无效的解决方法

    max-width 无效的解决方法: width:100% 和 max-width:100%的区别: width: 100%是将所有指定元素的宽度 拉伸或收缩到和父元素的宽度一致, 而max-widt ...

最新文章

  1. 计算机死机的重启方法,使用“紧急重启”功能让电脑重启，解决电脑死机！
  2. hive中的逻辑运算符 案列_Hive内置运算符
  3. iOS 获取当前月份的天数(转)
  4. 6.4.3树和森林的遍历
  5. 双系统(win10 1803+deepin 15.7)安装问题
  6. App 开发穷途末路？
  7. 解决 eclipse 生成 javadoc 中文乱码的问题
  8. 使用curl来调试你的应用
  9. 荣耀9桌面没有计算机,荣耀9四个隐藏功能，你用过几个？
  10. php 调用 百度句法分析,【原创源码】百度新版翻译API调用使用范例
  11. 根据qq宠物等级计算级别
  12. Pandas 那些年踩过的坑
  13. Java异常处理最佳实践及陷阱防范
  14. photoshop入门笔记1：PS的快捷键
  15. java前后台开发之文件上传
  16. 流氓软件卸载了又偷偷冒出来，dllhost.exe暗藏安装玄机
  17. addEventListener的常用事件
  18. MATLAB--数字图像处理 Otsu算法(MATLAB原理验证)
  19. 飞鸽传书绿色版XEIM指出
  20. mysql AES加密存储，解密读取

热门文章

  1. 3. 狂神的设计模式笔记-代理模式
  2. Unity3D 拆包工具 AssetStudio 编译构建
  3. 牛客网暑期ACM多校训练营(第三场): E. Sort String（KMP）
  4. Codeforces Round #462 (Div. 2): A. A Compatible Pair
  5. bzoj 2707: [SDOI2012]走迷宫（Trajan+高斯消元+Dp）
  6. pytorch中lr_scheduler的使用
  7. [Python] 关键字 yield 用法详解
  8. python基础系列教程——Python3.x标准模块库目录
  9. centos7下搭建hadoop、hbase、hive、spark分布式系统架构
  10. jQuery Mobile事件，开发全解+完美注释