martes, 8 de septiembre de 2015

jQuery length - Comprobar si un determinado elemento existe


En esta ocasión veremos como utilizar la propiedad length de jQuery para comprobar si un determinado elemento existe, length regresa 0 si el elemento no existe y si existe regresa el número de elementos. La propiedad length incluida como una condición en una sentencia if nos permitirá obtener un valor boolean, tengan en cuenta que 0 equivale a false, en caso de no existir, de lo contrario la condición será verdaderá ya que será mayor que 0.

A continuación pueden ver un ejemplo práctico ...

<html>
 <head>
  <meta charset="UTF-8" />
  <script type="text/javascript" src="https://code.jquery.com/jquery.js"></script>
  
  <script>
   $(function(){
   
    //Si la clase .exist existe, es mayor que 0
    if ($(".exist").length)
    {
     $("#result-exist").text("Existen " + $(".exist").length + " elementos con la clase .exist");
    }
    
    //Si la clase .foo no existe, es decir, no es mayor que 0
    if (!$(".foo").length)
    {
     $("#result-foo").text("No existe ningún elemento con la clase .foo");
    }
    
   });
  </script>
  
 </head>
 <body>
  <div class="exist">Existo, luego pienso</div>
  <div class="exist">Existo, luego pienso</div>
  <div class="exist">Existo, luego pienso</div>
  
  <p id="result-exist"></p>
  <p id="result-foo"></p>
  
 </body>
</html>