CODEWITHSUNDEEP
javascripthtmlcssdisplay
user694733
user694733

Reputation: 16043

How to return default display style of element with javascript?

Different HTML elements have different default display value. For example:

I have element which is hidden with javascript:

element.style.display = 'none';

How can I set the correct default value back, without having to deduce it from the element type:

// Sets 'block' if 'element' is 'div', 'inline-block' if 'span', etc.    
element.style.display = ?;

MDN reference doesn't seem to list default or anything similar for this.

No jQuery or similar libraries, vanilla Javascript only.

Upvotes: 0

Views: 3227

Answers (1)

Aslam
Aslam

Reputation: 9680

You can use the Remove Property.

document.getElementById(id).style.removeProperty( 'display' );

This will then use the default.

This seems to remove a display defined inline like style="display:none;" but not with <style> #id{ display:none;} </style>.

To remove a display:none; inside <style> it works with: element.style.display = 'initial';

Upvotes: 4

Related Questions