Maison > Article > interface Web > Comment implémenter le bouton masquant le div en javascript
Comment implémenter le bouton masquant le div en javascript
- 藏色散人original
- 2021-07-17 11:43:582523parcourir
Comment implémenter le masquage de bouton div en JavaScript : créez d'abord un exemple de fichier frontal ; puis récupérez l'événement de clic basé sur le bouton d'identification et enfin ajoutez la fonction de gestionnaire d'événement.
L'environnement d'exploitation de cet article : système Windows7, version javascript1.8.5&&html5, ordinateur DELL G3
JavaScript cliquez sur le bouton pour masquer et afficher la méthode div
Obtenez le clic événement selon le bouton id, Ajouter une fonction de traitement d'événement
Effet : 
<style>
#dv{
width: 100px;
height: 100px;
background-color: royalblue;
}
</style>
<body>
<input type="button" value="隐藏" id="btn"/>
<!--<input type="button" value="显示" id="btn1"/>-->
<p id="dv"></p>
<script>
function my(id){
return document.getElementById(id);
}
//第一种方法
/*my("btn").onclick=function(){
my("dv").style.display="none";
}
my("btn1").onclick=function(){
my("dv").style.display="block";
}*/
//第二种方法
my("btn").onclick=function(){
if (this.value =="隐藏") {
my("dv").style.display="none";
this.value="显示";
} else if(this.value =="显示"){
my("dv").style.display="block";
this.value="隐藏";
}
}
</script>
</body>Apprentissage recommandé : "Tutoriel avancé javascript"
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!