Para saber si el selector jQuery seleccionó algún elemento o no, aquí se analizan 2 métodos y estos son los métodos más utilizados.
Ejemplo-1: En este ejemplo, Selector busca el elemento <p> . Este ejemplo usa la propiedad de longitud para verificar si algo está seleccionado o no. En este caso se encuentra el elemento <p> .
<!DOCTYPE html> <html> <head> <title> JQuery | check if a selector matches something. </title> <script src= "https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"> </script> </head> <body style="text-align:center;" id="body"> <h1 style="color:green;"> GeeksForGeeks </h1> <p> A computer science portal for geeks. </p> <button onclick="gfg_Run()"> check </button> <p id="GFG_DOWN" style="color:green; font-size: 20px;"> </p> <script> var el_down = document.getElementById("GFG_DOWN"); var str = ''; function gfg_Run() { if ($("p").length) { str = "Something Selected"; } else { str = "Nothing Selected"; } el_down.innerHTML = str; } </script> </body> </html>
Producción:
- Antes de hacer clic en el botón:
- Después de hacer clic en el botón:
Ejemplo-2: En este ejemplo, Selector busca el elemento <a> . Este ejemplo también usa la propiedad de longitud para verificar si algo está seleccionado o no. En este caso no se encuentra el elemento <a> .
<!DOCTYPE html> <html> <head> <title> JQuery | check if a selector matches something. </title> <script src= "https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"> </script> </head> <body style="text-align:center;" id="body"> <h1 style="color:green;"> GeeksForGeeks </h1> <p> A computer science portal for geeks. </p> <button onclick="gfg_Run()"> check </button> <p id="GFG_DOWN" style="color:green; font-size: 20px;"> </p> <script> var el_down = document.getElementById("GFG_DOWN"); var str = ''; function gfg_Run() { if ($("a").length) { str = "Something Selected"; } else { str = "Nothing Selected"; } el_down.innerHTML = str; } </script> </body> </html>
Producción:
- Antes de hacer clic en el botón:
- Después de hacer clic en el botón:
Ejemplo-3: En este ejemplo, Selector busca el elemento <button> . Este ejemplo usa la función existe para verificar si algo está seleccionado o no. En este caso se encuentra el elemento <button> .
<!DOCTYPE html> <html> <head> <title> JQuery | check if a selector matches something. </title> <script src= "https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"> </script> </head> <body style="text-align:center;" id="body"> <h1 style="color:green;"> GeeksForGeeks </h1> <p> A computer science portal for geeks. </p> <button onclick="gfg_Run()"> check </button> <p id="GFG_DOWN" style="color:green; font-size: 20px;"> </p> <script> var el_down = document.getElementById("GFG_DOWN"); var str = ''; jQuery.fn.exists = function() { return this.length > 0; } function gfg_Run() { if ($("button").exists()) { str = "Something Selected"; } else { str = "Nothing Selected"; } el_down.innerHTML = str; } </script> </body> </html>
Producción:
- Antes de hacer clic en el botón:
- Después de hacer clic en el botón:
Publicación traducida automáticamente
Artículo escrito por PranchalKatiyar y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA