admin管理员组

文章数量:1024582

In this case I can not set the element state to visible:

<html>
<head>
  <style type="text/css">
    #elem {display:none}
  </style>
</head>
<body>
  <div id="elem">.......</div>
  <script type="text/javascript">
    document.getElementById("elem").style.display="";
  </script>
</body>
</html>

it works only when I set display to "block".

In this case it works:

<html>
<head>
</head>
<body>
  <div id="elem" style="display:none">.......</div>
  <script type="text/javascript">
    document.getElementById("elem").style.display="";
  </script>
</body>
</html>

My interest is to make it work in first case without setting "block".

In this case I can not set the element state to visible:

<html>
<head>
  <style type="text/css">
    #elem {display:none}
  </style>
</head>
<body>
  <div id="elem">.......</div>
  <script type="text/javascript">
    document.getElementById("elem").style.display="";
  </script>
</body>
</html>

it works only when I set display to "block".

In this case it works:

<html>
<head>
</head>
<body>
  <div id="elem" style="display:none">.......</div>
  <script type="text/javascript">
    document.getElementById("elem").style.display="";
  </script>
</body>
</html>

My interest is to make it work in first case without setting "block".

  • javascript
  • html
  • css
Share Improve this question asked Apr 4, 2013 at 10:26 PaulPaul 26.7k41 gold badges133 silver badges263 bronze badges 1
  • means the above thing {display:none} is not working, it not reading even {display:block} , because writin block or not wont create any difference, it'll display it as usual – Deepanshu Goyal Commented Apr 4, 2013 at 10:29
Add a ment  | 

4 Answers 4

Reset to default 5

Why do you want to use inline styles instead of css classes?

<html>
<head>
  <style type="text/css">
    #elem.hidden {display:none}
  </style>
</head>
<body>
  <div id="elem" class="hidden">.......</div>
  <script type="text/javascript">
    document.getElementById("elem").className = '';
  </script>
</body>
</html>

Setting the .style.display property to "" will remove any inline style from the element. The previous value in the cascade will then apply.

In this case, there is no inline style to start with, and the "none" value is already received from the cascade.

You could set the value to the "initial" keyword, but you may find browser support lacking.

You've abstracted whatever the underlying problem that you are trying to solve by modifying the display property away, but there is a good chance that you would be better off with:

#elem.JSOnly {display:none}

with:

<div id="elem" class="JSOnly">

and

document.getElementById('elem').className = ""

or similar.

Try this:

document.getElementById("elem").style.display="block";

You also use jQuery, like this.

<script type="text/javascript">
 jQuery('#elem').css('display','');
</script>

You want to also add jquery library.

In this case I can not set the element state to visible:

<html>
<head>
  <style type="text/css">
    #elem {display:none}
  </style>
</head>
<body>
  <div id="elem">.......</div>
  <script type="text/javascript">
    document.getElementById("elem").style.display="";
  </script>
</body>
</html>

it works only when I set display to "block".

In this case it works:

<html>
<head>
</head>
<body>
  <div id="elem" style="display:none">.......</div>
  <script type="text/javascript">
    document.getElementById("elem").style.display="";
  </script>
</body>
</html>

My interest is to make it work in first case without setting "block".

In this case I can not set the element state to visible:

<html>
<head>
  <style type="text/css">
    #elem {display:none}
  </style>
</head>
<body>
  <div id="elem">.......</div>
  <script type="text/javascript">
    document.getElementById("elem").style.display="";
  </script>
</body>
</html>

it works only when I set display to "block".

In this case it works:

<html>
<head>
</head>
<body>
  <div id="elem" style="display:none">.......</div>
  <script type="text/javascript">
    document.getElementById("elem").style.display="";
  </script>
</body>
</html>

My interest is to make it work in first case without setting "block".

  • javascript
  • html
  • css
Share Improve this question asked Apr 4, 2013 at 10:26 PaulPaul 26.7k41 gold badges133 silver badges263 bronze badges 1
  • means the above thing {display:none} is not working, it not reading even {display:block} , because writin block or not wont create any difference, it'll display it as usual – Deepanshu Goyal Commented Apr 4, 2013 at 10:29
Add a ment  | 

4 Answers 4

Reset to default 5

Why do you want to use inline styles instead of css classes?

<html>
<head>
  <style type="text/css">
    #elem.hidden {display:none}
  </style>
</head>
<body>
  <div id="elem" class="hidden">.......</div>
  <script type="text/javascript">
    document.getElementById("elem").className = '';
  </script>
</body>
</html>

Setting the .style.display property to "" will remove any inline style from the element. The previous value in the cascade will then apply.

In this case, there is no inline style to start with, and the "none" value is already received from the cascade.

You could set the value to the "initial" keyword, but you may find browser support lacking.

You've abstracted whatever the underlying problem that you are trying to solve by modifying the display property away, but there is a good chance that you would be better off with:

#elem.JSOnly {display:none}

with:

<div id="elem" class="JSOnly">

and

document.getElementById('elem').className = ""

or similar.

Try this:

document.getElementById("elem").style.display="block";

You also use jQuery, like this.

<script type="text/javascript">
 jQuery('#elem').css('display','');
</script>

You want to also add jquery library.

本文标签： htmlUnable to override displaynone in JavaScriptStack Overflow

版权声明：本文标题：html - Unable to override display:none in JavaScript - Stack Overflow 内容由热心网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://it.en369.cn/questions/1745621257a2159584.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。