Il metodo filter() di jQuery

Il metodo .filter() di jQuery filtra gli elementi selezionati.

.filter()

Ad esempio, in questo script assegno a una variabile il selettore myVar=$("p") dei tag <p> presenti nel DOM

<!DOCTYPE html>
<html>
<head>
<style>
#box { width:100px; height:100px; text-align:center; background:#f00; font-size:14px; }
#clickme { width:100px; border:1px solid #000; }
.rosso { color:red; }
.blu { color:blue; }
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
</head>
<body>
<div id="clickme">Click here</div>
<p>A</p>
<p>B</p>
<p>C</p>
<p>D</p>
<p>E</p>
<script>
$( "#clickme" ).click(function() {
myVar=$("p");
myVar.filter(":even").addClass("rosso");
myVar.filter(":odd").addClass("blu");
});
</script>

</body>
</html>

Quando l'utente clicca sull'id=clickme, il metodo myVar.filter(":even").addClass("rosso") filtra gli elementi <p> con indice pari e gli associa la classe rosso.

Il metodo myVar.filter(":odd").addClass("blu"), invece, filtra gli elementi <p> con indice dispari e gli associa la classe blu.

In questo modo i tag <p> alternano il colore rosso e blu

il metodo filter()

E così via.

 


 

Segnalami un errore, un refuso o un suggerimento per migliorare gli appunti

FacebookTwitterLinkedinLinkedin
knowledge base

jQuery