• An empty string ("")
• "hidden"
• "visible"

An element is visible when its style object's visibility property is either empty ("") or "visible". It is invisible when the property is "hidden". The following code segment renders two buttons and their onclick event handler:

<FORM>
<INPUT ID="button1" 
       STYLE="position:relative; left:0;" 
       TYPE="button" VALUE="Hide Other Button" 
       onclick="handleClick()">
<INPUT ID="button2" 
       STYLE="position:relative; left:150;" 
       TYPE="button" VALUE="Hide Me" 
       onclick="handleClick()">
</FORM>
<SCRIPT LANGUAGE="JavaScript">
<!--
function handleClick() {
  if (document.getElementById('button2').style.visibility != "hidden") {
    document.getElementById('button2').style.visibility = "hidden";
    document.getElementById('button1').value = "Show Other Button";
  }
  else {
    document.getElementById('button2').style.visibility = "visible";
    document.getElementById('button1').value = "Hide Other Button";
  }
}
// -->
</SCRIPT>

Click the left button to hide and reveal the right button:

People who read this tip also read these tips:

• Implementing the OnMouseUp Event Handler
• Extracting Information from the Error Object
• Playing with the StockQuote Web Service
• Defining a Polymorphic Interface
• Popping Up Message Boxes from the Server