Is the jquery css display property set to ``, is it valid?

Question

I used the following jquery code to hide and show an element in a button click event

<div id='testDiv'>Test</div> $('#testDiv').css('display','none'); $('#testDiv').css('display',''); 

There are many examples of setting the screen to lock, inline, etc., as well as using jquery hide and show. The above code that I used on my page works fine, but I don't know if it uses it correctly. Can someone please tell me if I should stop using it this way and use a valid property like "block". I used this because there was no initial display property for "testDiv".

Answer 1

Documented by jquery documentation as a valid way to remove the style that you previously manipulated with jquery. He will return it to the previous style. Remember some caveats:

Setting the value of the style property to an empty string - for example. $ ("#mydiv") .css ("color", "") - removes this property from the element if it has already been applied directly, either in the HTML style attribute, through the jQuery.css () method or through direct DOM manipulation property style. As a result, the element style for this property will be restored no matter what value was applied. Thus, this method can be used to undo any style modification that you previously performed. However, it does not remove the style applied by the CSS rule in the stylesheet or element. Warning: one of the notable exceptions is that for IE 8 and below, deleting a shorthand property, such as a border or background, will completely remove this style from the element, regardless of what is set in the stylesheet or element.

From jquery docs here:

http://api.jquery.com/css/

Answer 2

I also use the same method that adds css to HTML elements via jQuery, for me it perfectly cancels the css property, because the browser itself removes the css attributes without a value. If you install a display unit, this may cause some problems to appear in the display unit, which will violate your current HTML structure.

However, if you want this to be correct, you can use the addClass and removeClass methods and create a class

 .hideBlock{ display : none; } 

JQuery code

 $('#testDiv').addClass('hideBlock); //to Hide $('#testDiv').removeClass('hideBlock); //to show