How to show and hide Html elements

Methods to display and hide Html elements: 1. The visibility of the div can control the display and hiding of the div, but the page will appear blank after hiding; 2. By setting the display attribute, the occupied page space can be released after the div is hidden.

The operating environment of this tutorial: windows7 system, html5 version, DELL G3 computer.

Methods to display and hide Html elements:

1. The visibility of div can control the display and hiding of div, but the page will appear blank after hiding:

　　style="visibility: none;"
 
　　document.getElementById("typediv1").style.visibility="hidden";//隐藏
 
　　document.getElementById("typediv1").style.visibility="visible";//显示
 
    $("#divid").css("vicibility","hidden")
 
    $("#divid").css("vicibility","visible")

2. By setting the display attribute, you can hide the div and release the occupied page space, as follows

　style="display: none;"
 
　　document.getElementById("typediv1").style.display="none";//隐藏
 
　　document.getElementById("typediv1").style.display="";//显
 
    $("#divid").css("display","none");
 
    $("#divid").css("display","");

Related learning recommendations:html video tutorial

The above is the detailed content of How to show and hide Html elements. For more information, please follow other related articles on the PHP Chinese website!