【报错】IE下使用js隐藏元素display='none'不生效

最新推荐文章于 2023-05-12 15:48:02 发布
最新推荐文章于 2023-05-12 15:48:02 发布
阅读量3.3k 收藏
点赞数
分类专栏： 前端 文章标签： dispaly IE javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/BobYuan888/article/details/103522380
版权

一、问题描述

今天在写页面时，在js中用到了下面这句来隐藏页面上的元素：

document.getElementById("xxx").style.display = 'none';

但是使用IE打开页面的时候，发现这部分元素并没有成功被隐藏。

 

二、问题解决

于是首先考虑的是可能IE不支持这个语法，但是查找了资料后确认IE是支持这个语法的。

 

纠结了一会儿，发现IE下方弹了个提示框：“Internet Explorer已限制此网页运行可以访问计算机的脚本或ActiveX控件”。启用控件后，发现可以正常隐藏了。原来是因为IE禁止了JavaScript的执行。

 

那么如何让IE默认允许执行html中的JavaScript脚本呢？参考了以下这篇文章：

https://www.jianshu.com/p/d5e335a63382

 

在html和head标签中间添加save from url这句：

<html xmlns="http://www.w3.org/1999/xhtml">
<!-- saved from url=(0014)about:internet -->
<head>

添加完再重新打开，JavaScript可以执行，元素成功被隐藏了。

忘尘~
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
javascript获取隐藏元素(display:none)的高度和宽度的方法
10-25
主要介绍了javascript获取隐藏元素(display:none)的高度和宽度的方法,实现方法比较复杂,需要的朋友可以参考下
ie9崩溃现象当js设置tr元素样式为display:none
12-13
在IE9浏览器中，当你尝试使用JavaScript来设置`<tr>`元素的CSS样式为`display:none`时，可能会遇到浏览器崩溃的问题。这个问题主要是由于IE9对表格元素（如`<tr>`、`<td>`等）处理方式的特定缺陷引起的。在IE9中，...
display:none; 失效原因
热门推荐
harry_yaya的博客
06-14 2万+
可能是元素之前已经设置了 display的类型，例如： .icon-openEye{ display:inline-block; position: relative; left: -12%; width: 22px; height: 22px; } 此时，我再通过jQuery的方法为该元素添加一个none的class. $('.icon-openEye').addClass('non...
js中style.display=""无效的解决方法
10-25
主要介绍了js中style.display=""无效的解决方法,是js程序设计中非常常见的问题,需要的朋友可以参考下
解决Select标签的Option在IE浏览中display:none不生效的问题
dizong1532的博客
05-08 1183
页面的Select标签，需要控制Select的Option不需要显示，根据条件来隐藏某些Option选项。 正常情况下使用hide()就能实现，hide()方法实际是给Option加上display属性(display:none)，这样就可以隐藏掉Option； 但是IE浏览器下Option(display:none)是不生效的，解决方案是：直接对Option包一层，加Span标签。...
display:none 属性在IE5.6.7.8.9下失效的解决方案
PENGFUMING的专栏
09-01 1632
.DB_tab25 .DB_bgSet li{position:absolute;width:100%;height:420px;display:none;}
js中style.display=””无效的解决方法
01-19
本文实例讲述了js中style.display=””无效的解决方法。分享给大家供大家参考。具体解决方法如下： 一、问题描述： 在js中我们有时想动态的控制一个div显示或隐藏或更多的操作，但如果我们style.display=””可能导致没有效果。 看下面一段代码： 代码如下:<style>  #name  {      display:none;  } </style> </head> <body> <div id=”name”> My name is smile. </div> </body> </html> [removed] [removed]=function(){ doc
IE中，JS在操作style属性时报出"找不到成员"错误
wwwcomy的程序猿感悟
02-28 1374
同样一行代码： document.body.style=document.body.style || {} 在IE中会报出"找不到成员"的错误，貌似IE中不支持这种style操作。 项目中有一个类似的代码，也没看出来这行代码作用有多大，直接判断浏览器略过了，测试倒是没有影响。 如果IE中要修改style的话看来还得一个一个的操作啊。...
IE7下父元素及子元素的隐藏顺序不当带来的display:none出现BUG
01-19
IE 7 下， 先隐藏 父元素，后隐藏子元素，再显示父元素， 被隐藏的子元素 重叠区域下面， 存在另一个可见的元素， 则该 display:none的子元素出现BUG： 背景和图片(img元素，不仅仅是图片背景)仍然显示， 但文字不...
javascript style.display = "" 和style.display="none
weixin_33923148的博客
01-06 310
2019独角兽企业重金招聘Python工程师标准>>> ...
option中css失效,option.style.display =“ none”在野生动物园中不起作用
weixin_42566072的博客
08-04 642
HTML：helloI'M THE CHOSEN ONEasdwerqweJS：var sel = document.getElementById("asd");var optnz = sel.getElementsByTagName("option")[1];sel.value = optnz.value;optnz.style.display = "none";如您所见，它在chrome中有效...
js设置属性display无效
YIBOFan
12-18 4170
在写js样式设置问题，设置的display的值为none和block之间切换时无效。我的效果：进入页面display为none，点击后改为block，点击其他的再改为none。 //第一步：隐藏页面加载设置 $("#openDetailWindow").css("display","none") //第二步：显示。进入点击事件的方法内 $("#openDetailWindow").toggle();//切换状态 $("#openDetailWindow").show(); //第三步：隐藏。 $("#ope
使用display:none,动画不生效问题
qq_39262418的博客
10-20 1447
方法一、改用visibility：hidden，虽然不可见了，但是仍然会占据页面上的空间 方法二、利用延时 setTimeout(function(){ document.getElementById("id").style.display="none" }, 1000); //1s是动画时间。
完美解决IE浏览器 option display:none 隐藏无效
郭猛的博客
11-04 9009
最近遇到了select 下的option需要根据前一个select选项来显示或隐藏，发现在IE下该功能无法实现。 自己在网上看了一下前辈们的解决方法，然后根据自己的实际情况改了一下，放在这里给需要的朋友。//初始化select function toggleOptionInit(obj,firstException){ var firstException = argume
document.getElementById(I).style.display=““不起作用
w710537643的博客
01-05 5017
console.log("INTP") var tag = document.getElementById("INTP"); console.log(tag) tag.style.display = ""; console.log(tag.style.display) console.log("INTP") var tag = document.getElementById("INTP"); console.log(tag) tag.style.d
IE浏览器不支持display:none导致option不能隐藏的问题
韦观松のBóKè
04-28 9889
项目场景：级联的select元素，根据一级select的选择，二级select中的option选项需要对应的隐藏或显示。 原来的做法是display:none和display:block来隐藏和显示option，option中通过自定义属性data-category过滤，控制option的隐藏或显示，结果在IE浏览器中并不能达到想要的效果，通过网络查找，是因为IE浏览器不支持display:no
display:none；失效
AR_Pai的博客
03-03 600
你的元素就会失效，只有你删掉父级元素的display:none;，子级元素才会奏效。
解决IE6下div table 使用display:none;隐藏时仍然占空白位置
风之音
04-13 559
在所有要隐藏的div元素后面增加： &lt;span style='clear:both;'/&gt;   可解决IE6 的 display:none; bug   &lt;div&gt; 这里是要隐藏的div，通过jquery.hide()方式隐藏它，ie6下仍会在物理上占用空间，后面的对象无法上移；可在各该div对象的后面增加&lt;span style='clear:both;'...
（五）【小插曲】index.js文件关于参数隐式具有”any”类型的报错的问题解决
qq_38250687的博客
05-12 1174
调试过程的小插曲
获取表单内的元素是否被display=none隐藏 display=none会设置在父容器的class上，通过表单元素的name属性输出
最新发布
05-24
您可以使用 JavaScript 中的 `getComputedStyle` 方法来获取元素的样式属性，包括 `display` 属性。然后，您可以检查该属性是否设置为 `none`，以确定元素是否被隐藏。 以下是一个可能的示例： ```html <form> <input type="text" name="input1"> <input type="text" name="input2" style="display:none;"> <button onclick="checkElements()">Check elements</button> </form> <script> function checkElements() { const form = document.querySelector('form'); const inputs = form.elements; for (let i = 0; i < inputs.length; i++) { const input = inputs[i]; const computedStyle = getComputedStyle(input); if (computedStyle.display === 'none') { console.log(`Element with name "${input.name}" is hidden.`); } else { console.log(`Element with name "${input.name}" is visible.`); } } } </script> ``` 在上面的示例中，我们首先获取表单元素的引用，然后遍历所有表单元素并获取它们的计算样式。如果计算样式的 `display` 属性为 `none`，则打印出该元素已被隐藏的消息。否则，打印出该元素可见的消息。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值