Esempio 02 – Ancora sui selettori annidati

Riproponiamo lo stesso esempio in realtà ma questa volta con altri selettori. Diamo un’occhiata al codice.

<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
$(document).ready(function(){
    $("#pippo").click(function(){
        $("p.ciccio").hide();
    });
});
</script>
</head>
<body>

<h2>una intestazione con h2</h2>

<p>un paragrafo</p>
<p class="ciccio">Un altro paragrafo.</p>

<button id="pippo">Clicca per nascondere il secondo paragrafo</button>

</body>
</html>

Provate ora a togliere .ciccio, il bottone vi farà nascondere tutti i paragrafi con un solo colpo. Questo ci permette di vedere come usare il selettore multiplo o singolo. Altro selettore per il bottone: se invece di #pippo ci inserisco :button, ci seleziona il button o comunque tutti gli input con type=’button’

Ultima modifica 3 Novembre 2022