Il existe deux manières de masquer les contrôles à l'aide de JavaScript : la première consiste à définir les attributs « affichage » et « visibilité » du style du contrôle. Le contrôle est visible lorsque style.display="block" ou style.visibility="visible", et est invisible lorsque style.display="none" ou style.visibility="hidden". La différence est que "affichage" non seulement masque le contrôle, mais aussi le contrôle masqué n'occupe plus la position occupée lors de l'affichage, tandis que le contrôle masqué par "visibilité" rend uniquement le contrôle invisible, et le contrôle occupe toujours sa position d'origine. position.
Copiez le code comme suit :
fonction displayHideUI()
{
var ui = document.getElementById("bbs");
ui.style.display="aucun";
}
fonction displayShowUI()
{
var ui = document.getElementById("bbs");
ui.style.display=" ";//Cela fonctionnera si l'affichage est vide, mais s'il s'agit d'un bloc, l'espace suivant sera renvoyé à la ligne.
}
fonction visibilitéHideUI()
{
var ui = document.getElementById("bbs");
ui.style.visibility="caché";
}
fonction visibilitéShowUI()
{
var ui = document.getElementById("bbs");
ui.style.visibility="visible";
}
</script>
description de la valeur
none Cet élément ne sera pas affiché.
block Cet élément sera affiché comme un élément de niveau bloc avec des sauts de ligne avant et après cet élément.
par défaut en ligne. Cet élément sera affiché comme un élément en ligne sans saut de ligne avant ou après l'élément.
inline-block Élément de bloc en ligne. (Nouvelle valeur dans CSS2.1)
list-item Cet élément sera affiché sous forme de liste.
run-in Cet élément apparaîtra comme un élément de niveau bloc ou un élément en ligne, selon le contexte.
compact Il existe une valeur compact en CSS, mais elle a été supprimée de CSS2.1 en raison du manque de support généralisé.
marqueur Il existe un marqueur de valeur dans CSS, mais il a été supprimé de CSS2.1 en raison du manque de support généralisé.
table Cet élément sera affiché sous forme de tableau au niveau bloc (similaire à <table>), avec des sauts de ligne avant et après le tableau.
inline-table Cet élément sera affiché sous forme de tableau en ligne (similaire à <table>), sans saut de ligne avant et après le tableau.
table-row-group Cet élément sera affiché sous la forme d'un groupe d'une ou plusieurs lignes (similaire à <tbody>).
table-header-group Cet élément sera affiché sous forme de groupe d'une ou plusieurs lignes (similaire à <thead>).
table-footer-group Cet élément sera affiché sous la forme d'un groupe d'une ou plusieurs lignes (similaire à <tfoot>).
table-row Cet élément sera affiché sous forme de ligne de tableau (similaire à <tr>).
table-column-group Cet élément sera affiché sous forme de groupe d'une ou plusieurs colonnes (similaire à <colgroup>).
table-column Cet élément sera affiché sous forme de colonne de cellule (similaire à <col>)
table-cell Cet élément sera affiché sous forme de cellule de tableau (similaire à <td> et <th>)
table-caption Cet élément sera affiché sous forme de titre de tableau (similaire à <caption>)
hériter spécifie que la valeur de l'attribut display doit être héritée de l'élément parent.