About jquery and zepto.js determine the visibility of elements and show or hide summary __js

first, the use of jquery control div display and hide

Using jquery to control the display and concealment of a div can be done in a word, for example:

1.$ ("#id"). Show () is Display:block,

$ ("#id"). Hide () is expressed as display:none;

2.$ ("#id"). Toggle () Toggles the visible state of the element. Switches to hidden if the element is visible, or to visible if the element is hidden.

3.$ ("#id"). CSS (' Display ', ' none ');/hide

$ ("#id"). CSS (' Display ', ' block ');

Or

$ ("#id") [0].style.display= ' None ';

Display=none Control object's hiding
Display of Display=block control objects

4.$ ("#id"). CSS (' visibility ', ' hidden ');//Element hide

$ ("#id"). CSS (' visibility ', ' visible ');//element display

The CSS Visibility property stipulates whether the element is visible.
The visible element is visible.
The hidden element is not visible.
Collapse when used in a TABLE element, this value deletes a row or column, but it does not affect the layout of the table. The space occupied by the row or column is left to use for other content. If this value is used on other elements, it is rendered as "hidden".
Inherit inherits the value of the visibility property from the parent element.

use jquery to determine if elements are hidden

JQuery ("#tanchuBg"). CSS ("display")
JQuery ("#tanchuBg"). Is (": visible")
JQuery ("#tanchuBg"). Is (": hidden")

third, zepto.js to determine the visibility of elements and show or hide

Because Zepto.js does not support jquery's jquery ("#tanchuBg"). Is (": hidden") and jquery ("#tanchuBg"). Is (": visible").

I have seen most of the online use of the following methods, but the test is still not, thinking I get elements. CSS ("visibility") returns all visible. (Below is the method of harvesting the Internet)

(1) can check the CSS properties of the display: CSS ("display") = = "Block"

(2) can check visible: visible/Hidden: CSS ("visibility") = = "visible"

Examples are as follows:

Evaluation Hide-Show
$ ('. Comment-btn '). Click (function () {
if ($ ('. Hidecomment '). CSS ("display") = = "None") {

$ ('. Hidecomment '). Show ();
$ ('. Btnarrow '). Removeclass (' btnarrowtop ');
$ ('. Btnarrow '). addclass (' Btnarrowdown ');
}else if ($ ('. Hidecomment '). CSS ("display") = = "Block") {

$ ('. Hidecomment '). Hide ();
$ ('. Btnarrow '). addclass (' btnarrowtop ');
$ ('. Btnarrow '). Removeclass (' Btnarrowdown ');
}

});

---------------------------------------------------------------------------------------------

In combination with the above methods, I conclude as follows:

$ (". Item_father"). On ("click",() {
        if().Next (  "Table"). CSS ("visibility""visible") {
            $(this). Next (" Table "). CSS (" visibility "," hidden ");
            $ (this). Next ("table"). Hide ();
        Else {
            $(this). Next ("table"). CSS ("visibility","visible" );
            $ (this). Next ("table")

 

You must manually set the value of the CSS property visibility within the method.

-----------------------------------------------------------------------------

of course, jquery and Zepto both offer $ ("div"). Toggle (); Method. This method can either turn the display directly into hiding or turn the shadowing into a display.