将元素显示无返回到默认样式值JS

问题描述

我在JS中有一个函数隐藏被解析的元素：

  c> 块，其他元素inline或列表list-item如何恢复其默认状态？
  function show（id）{
 document.getElementById（id） .style.display =?????; 
} 
  
 我知道如何在Jquery中做，  
 
 
 
在CSS中，可能有包含 style：none  
 
 
 
由于在我的示例中有CSS  style.display =''消除了添加JS的样式，但可以返回CSS中添加的任何样式，即使在使用CSS分配样式之前，我仍希望将其恢复为默认值。
 
 
 
尝试这是因为它是在其中一个注释的链接中建议：
  elem = document.getElementById（id）; 
 var theCSSprop = window.getComputedStyle（elem，null）.getPropertyValue（display）; 
  
但在本例中'theCSSprop' none对于 div ，当我期望block 
 
 
 
任何想法？ 
感谢。
解决方案
您只需将其分配为空值：
  document.getElementById（id）.style.display =; 
  
或使用 removeProperty 方法：
  document.getElementById（id）.style.removeProperty（'display'）; 
  
但请注意， removeProperty   IE< 9 。
 
 
如果你想得到原始的CSS值，你需要从空的< iframe> 元素。我在jsFiddle上创建了，如何使用 getComputedStyle  
 
 
请注意， getComputedStyle 不支持旧版IE。它支持IE9 +。
 
 
 
对于IE8，您应该使用 
 
I have a function in JS that hides the element parsed:
function hide(id){
  document.getElementById(id).style.display = "none";
}
How can I create a function that brings back the element to the default style value. For instance a div display property is "block" as for an image is "inline-block", other elements are "inline" or lists are "list-item" How can I bring them back their default state?
function show(id){
  document.getElementById(id).style.display = "?????";
}
I know how to do it in Jquery but it is not an option.
In CSS there might be styles for the elements including style:none, which need to be overwritten to the default value.
Since there is CSS in my example making style.display = '' eliminates the style added with JS but gets back to whatever style is added in CSS, I want to bring it back to its default value even before assigning styles with CSS.
I tried this as it was suggested in a link in one of the comments:
elem = document.getElementById(id);
var theCSSprop = window.getComputedStyle(elem,null).getPropertyValue("display");
but in this case 'theCSSprop' returns "none" for a div, when I expect "block"
Any ideas?Thanks.
 解决方案 
You need just assign it to empty value:
document.getElementById(id).style.display = "";
Or using removeProperty method:
document.getElementById(id).style.removeProperty( 'display' );
But note that removeProperty will not work on IE<9.
If you want to get original CSS value you will need probably to get it from empty <iframe> element. I created example on jsFiddle how to get current value using getComputedStyle and iframe value on jsFiddle.
Please note that getComputedStyle not support old versions of IE. It support IE9+.
For IE8 you should use Element.currentStyle
                        
这篇关于将元素显示无返回到默认样式值JS的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！