Maison >interface Web >tutoriel CSS >Comment puis-je contrôler la visibilité des divisions avec un bouton utilisant JavaScript ou jQuery ?

Comment puis-je contrôler la visibilité des divisions avec un bouton utilisant JavaScript ou jQuery ?

Barbara Streisand
Barbara Streisandoriginal
2024-12-21 10:59:09292parcourir

How Can I Control Div Visibility with a Button Using JavaScript or jQuery?

Comment manipuler la visibilité div à l'aide d'un bouton

Vous pouvez contrôler la visibilité d'un élément div via un bouton en utilisant différentes approches. Voici comment procéder :

JavaScript pur :

Cette méthode utilise la propriété d'affichage de CSS :

var button = document.getElementById('button');
button.onclick = function() {
    var div = document.getElementById('newpost');
    if (div.style.display !== 'none') {
        div.style.display = 'none';
    }
    else {
        div.style.display = 'block';
    }
};

jQuery :

jQuery propose une version plus concise approche :

$("#button").click(function() {
    $("#newpost").toggle();
});

Explication :

La méthode JavaScript bascule directement la propriété d'affichage du div entre "aucun" (caché) et "bloc" (visible) . La méthode jQuery utilise la fonction toggle(), qui gère facilement les opérations de masquage et d'affichage.

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!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn