jQuery - Método más cercano (selector)

Descripción

los closest( selector )El método funciona mirando primero el elemento actual para ver si coincide con la expresión especificada, si es así, solo devuelve el elemento en sí. Si no coincide, continuará recorriendo el documento, padre por padre, hasta que se encuentre un elemento que coincida con la expresión especificada. Si no se encuentra ningún elemento coincidente, no se devolverá ninguno.

Sintaxis

Aquí está la sintaxis simple para usar este método:

selector.children( [selector] )

Parámetros

Aquí está la descripción de todos los parámetros utilizados por este método:

selector - Este es el selector que se utilizará para filtrar los elementos.

Ejemplo

A continuación se muestra un ejemplo simple que muestra el uso de este método:

<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>

Esto producirá el siguiente resultado:

jquery-traversing.htm

↰ Previous page