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