Sahat Yalkabov
Sahat Yalkabov

Reputation: 33624

Hiding element with reflow in JavaScript and how is it different from CSS hidden property?

I have two buttons, one passes true argument, another does not. Both buttons disappear when I press on them. But what exactly is going on behind the scenes for each button?

If this code looks familiar to you, it's from JavaScript: The Definitive Guide 6th Edition. Great book!

One more thing. In C++ and Java omitting an argument would result in a compile-error. In C# you could change the second argument to be optional and it would work. In JavaScript I didn't have to do that. Are all arguments in JavaScript optional?

JavaScript:

function hide(e, reflow) {
    if (reflow) {
        e.style.display = "none";
    }
    else {
        e.style.visibility = "hidden";
    }
}

HTML:

<button onclick="hide(this,true); debug('hide button 1');">Hide1</button>
<button onclick="hide(this); debug('hide button 2');">Hide2</button>

Upvotes: 1

Views: 500

Answers (2)

Adilson de Almeida Jr
Adilson de Almeida Jr

Reputation: 2755

Yeap!

In Javascript you have all arguments optional. Actually you don´t need to name your arguments. There is a implicit var called "arguments" where you can find an array of your arguments. You can ever access your arguments through this var.

Take a look at: https://developer.mozilla.org/en/JavaScript/Reference/functions_and_function_scope/arguments

Upvotes: 1

pmaruszczyk
pmaruszczyk

Reputation: 2155

Yes, all arguments in JavaScript are optional.

With display:none is something similar to width:0; height:0, and if you set the visibility to hidden button stay on it's place, but it is invisible.

Upvotes: 2

Related Questions