jQuery - metodo più vicino (selettore)

Descrizione

Il closest( selector )funziona esaminando prima l'elemento corrente per vedere se corrisponde all'espressione specificata, in tal caso restituisce semplicemente l'elemento stesso. Se non corrisponde, continuerà ad attraversare il documento, genitore per genitore, finché non viene trovato un elemento che corrisponde all'espressione specificata. Se non viene trovato alcun elemento corrispondente, non ne verrà restituito nessuno.

Sintassi

Ecco la semplice sintassi per utilizzare questo metodo:

selector.children( [selector] )

Parametri

Ecco la descrizione di tutti i parametri utilizzati da questo metodo:

  • selector - Questo è il selettore da utilizzare per filtrare gli elementi.

Esempio

Di seguito è riportato un semplice esempio che mostra l'uso di questo metodo:

<html>
   <head>
      <title>The jQuery Example</title>
      <script type = "text/javascript" 
         src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js">
      </script>
		
      <script>
         $(document).ready(function(){
            $(document).bind("click", function (e) {
               $(e.target).closest("li").toggleClass("highlight");
            });
         });
      </script>
		
      <style>
         .highlight { color:red; background: yellow;}
      </style>
   </head>
	
   <body>
      <div>
         <p>Click any item below to see the result:</p>
			
         <ul>
            <li class = "top">list item 1</li>
            <li class = "top">list item 2</li>
            <li class = "middle">list item 3</li>
            <li class = "middle">list item 4</li>
            <li class = "bottom">list item 5</li>
            <li class = "bottom">list item 6</li>
         </ul>
      </div>
   </body>
</html>

Questo produrrà il seguente risultato:

jquery-traversing.htm