Javascript Girl
  1. Javascript Girl
  3. Masquer les éléments Html en utilisant javascript
Intereting Posts
Arrêter un champ de saisie sous une forme d'envoi Comment connecter Google et permettre à mon utilisateur d'inviter ses contacts JavaScript const Mot-clé Rétablir les animations jquery dans les états CSS originaux Comment attraper NetworkError en JavaScript? Le moyen le plus rapide pour reproduire un tableau – tranche vs for loop Onblur vs onclick timing Suppression des balises html et du contenu dans lequel le contenu du tag correspond à un éventail de valeurs à l'aide de Xml.parse () Obtenez la valeur absolue d'un nombre en Javascript Comment se connecter au débogueur Webkit de l'iPhone? La mise en œuvre de la position fixe dans javascript provoque une gigue dans Safari lors du défilement Knockout.js foreach: mais seulement lorsque la comparaison est vraie Convertir du RTF en texte brut JQuery fait partie de la classe avec hasClass Regex pour obtenir du texte entre les derniers brackets ()

Masquer les éléments Html en utilisant javascript

Comment puis-je cacher les éléments html en utilisant javascript si j'ai cette page html 

<body> <h1>test</h1> <div id="1" align="center" style="padding-top: 10%;" > <h1 style="color: #FFFFFF">fawazapp</h1> <p style="color: #C0C0C0;"> bbb</p> <p style="color: #FFFFFF;">aaaaaaaaa</p> </div> <div id="2" align="center" style="padding-top: 10%;" > <h1 style="color: #FFFFFF">fawazapp</h1> <p style="color: #C0C0C0;"> bbb</p> <p style="color: #FFFFFF;">aaaaaaaaa</p> </div> </body>

Je veux cacher tous les éléments sauf div avec le numéro d'identification 2 pour être comme cette page 

 <div id="2" align="center" style="padding-top: 10%;" > <h1 style="color: #FFFFFF">fawazapp</h1> <p style="color: #C0C0C0;"> bbb</p> <p style="color: #FFFFFF;">aaaaaaaaa</p> </div>

En plus de la réponse de DevlshOne, vous pouvez également utiliser css pour que cela ne s'affiche pas: 

 var divOne = document.getElementById('1'); divOne.style.display='none';

Il y a une différence entre les deux. Avec la visibilité cachée, l'espace sera toujours consommé par le div, mais vous ne pouvez pas le voir. Avec display = 'none', il est comme s'il n'était pas là.

Choisissez le meilleur pour vous.

Vous devrez utiliser quelque chose comme ceci: 

 document.getElementById("1").style.display = "none";

Les réponses ci-dessus sont fondamentalement correctes, mais vous devez être conscient d'une différence entre display = "none" & visibility = "hidden". Avec l'affichage «aucun», l'élément est supprimé de la disposition des éléments de la page. Avec la visibilité "cachée", l'élément occupe toujours son espace, vous ne le voyez plus plus. 

 var divOne = document.getElementById('1'); divOne.style.visibility = 'hidden';

document.getElementById sur MDN