Geek asks and answers

Equivalent to .show () - jQuery in plain JavaScript

Does anyone have an idea of ​​what is equivalent to .show () jquery in javascript?

I tried using document.getElementById and add / remove a class that I called "show" // "hide", but this does not work very well. Perhaps I had the wrong attributes in these classes. I'm not sure.

class show:

.show{
    position:relative;
    display:block;
}

and hide class:

.hide{
    position:absolute;
    top:0px;
    right:0px;
    display:none;
}

I am sure there is a better way to go this way.

+5
source share
5 answers
document.getElementById('myElement').style.display = 'block'; // show
document.getElementById('myElement').style.display = 'none'; // hide
+12
source

jQuery , display. show(), , . display block none.

:

function hide(){
    //get previous display value
    //store it in an internal cache. jQuery has an internal data storage
    //hide element
}

function show(){
    //get previous display value for that element
    //apply to element to show it
}

.show()

. .css('display', 'block'), , , . inline, , .

+4

document.getElementById("MyId").className='show' document.getElementById("MyId").className='hide'

0

document.getElementsByClassName, .show .hide. , . : .

0

jQuery , / :

HTMLElement.prototype.toggleDisplay = function(on_or_off, display_type) {
    if (typeof(tddisptype) == "undefined") tddisptype = "block";
    var new_display;
    if (typeof(on_or_off) != "boolean") {
        if (this.style.display == "none") new_display = display_type;
        else new_display = "none";
    } else {
        if (on_or_off) new_display = display_type;
        else new_display = "none";
    }
    this.style.display = new_display;
}​

This adds the toggleDisplay () function to all elements; for example, those that you can get through document.getElementById (). You can pass it trueeither falseas a parameter to show or hide the element, or if you do not pass the parameter to it, it will try to figure out, show or hide the element. The second argument indicates the type of display associated with the "on" state; above, by default it is equal block.

0
source

More articles:


All Articles