Trabajando con elementos en jQuery: Métodos de búsqueda
Resumen: En este artículo estudiaremos la obtención de elementos mediante métodos de búsqueda y así formar subconjuntos, analizaremos las funciones find, is y contains.
Tal y como ya hemos venido manejando en los dos últimos artículos de nuestro tutorial, el tema en esta entrega será la creación de subconjuntos de elementos envueltos. Es de nuestro saber, que existen varias maneras de poder concretar dicha operación, por lo que en esta ocasión nos enfocaremos en buscar expandir un poco más nuestra visión estudiando tres nuevas y distintas maneras de obtenerlos a partir de un conjunto ya existente.
Con un poco de la famosa “magia” que nos ofrece jQuery, aún podemos realizar un par de trucos que nos regresen colecciones de elementos envueltos, lo que a su vez nos permitirá su operación. Para llevar acabo esto usaremos las funciones “find()”, “is()” y “contains()”, tres métodos sencillos y de fácil comprensión que explicaremos a continuación.
Método Find
El método “find()” nos permite buscar elementos a través de un conjunto envuelto existente e irlos recolectando, para que finalmente nos devuelva un nuevo conjunto que contenga todos los elementos que coincidieron con la expresión que se proporcionó como parámetro. Por ejemplo, si suponemos que tenemos un conjunto envuelto guardado en la variable “conjEnv”, y queremos obtener un nuevo subconjunto que contenga todos elementos que son párrafos de tipo cita y que se encuentran en el conjunto original, aplicaremos una sentencia como la siguiente:
conjEnv.find("p cite");
Hay que tener en cuenta que también existe la posibilidad de utilizar esta función con una sola instrucción, basta con pasar un parámetro de contexto dentro del selector jQuery de la siguiente manera:
jQuery('p cite', conjEnv);
Con esto la función jQuery recibe dos parámetros, el primero indicando la expresión a buscar y el segundo dando el conjunto donde se buscará.
En principio el método puede resultar bastante simple, pero como en muchos de los otros métodos de jQuery relacionados a conjuntos envueltos, el verdadero poder del método se puede observar cuando es utilizado como parte de una cadena de operaciones.
En resumen, este método se encargará de devolvernos un subconjunto con elemento de coincidencia a una expresión pasada como parámetro, dicho parámetro debe ser una cadena, que representa un selector de jQuery con él que los elementos deseados deben coincidir.
Método Contains
Además de encontrar los elementos de un conjunto envuelto que coincidan con un selector de jQuery, jQuery también proporciona un método para encontrar los elementos que contienen una cadena especifica. El método “contains()” devolverá un nuevo conjunto envuelto que consta de todos los elementos que contienen la cadena, que se pasa como parámetro, en cualquier lugar dentro de su contenido. Consideremos el siguiente código:
jQuery('p').contains('Texto de prueba');
Esta expresión obtiene un conjunto que contiene envueltos todos los párrafos que poseen en su contenido la cadena “Texto de prueba”. Hay que tener en cuenta que en este ejemplo hemos aplicado el método de búsqueda a todo el cuerpo del documento, por lo que en dicha búsqueda se incluyen los elementos hijos del párrafo, junto con sus etiquetas y atributos, pero no se toman en cuenta los atributos de la propia etiqueta, por lo que el resultado no regresa coincidencias dentro de la misma etiqueta “p”.
Método Is
El último método que vamos a examinar en este artículo es uno que nos permite poner a prueba un conjunto envuelto para ver si contiene al menos un elemento que coincida con el selector de la expresión dada. El método “is()” devuelve “true”(Verdadero) si al menos un elemento coincide con el selector, y “false”(Falso) si ninguno coincide. Por ejemplo:
var tieneImagenes = jQuery('*').is('img');
Con esta declaración establecemos que el valor de la variable “tieneImagenes” será “true” si la página actual tiene algún elemento de tipo imagen. Con ello podemos formar un subconjunto con aquellos elementos que contengan las partes que deseamos, y así una vez todos juntos aplicar una operación específica únicamente a los de esa clase.
Conclusión
En este artículo tuvimos la oportunidad de analizar y evaluar tres sencillos métodos de búsqueda que nos proporciona la librería por defecto, su uso puede ir variando con el paso del curso, pero en esta ocasión les hemos dado un enfoque relacionado a la creación de subconjuntos. A partir del siguiente artículo empezaremos a estudiar el manejo de cadenas en jQuery.
LaWebera.es te informa que los datos de carácter personal que me proporciones rellenando el presente formulario serán tratados por Verónica Milán Gómez (LaWebera.es) como responsable de esta web.
Finalida: recogida y tratamiento de los datos personales que te solicito es para gestionar los comentarios que realizas en este blog.
Legitimación: Consentimiento del interesado.
Como usuario e interesado te informo que los datos que me facilitas estarán ubicados en los servidores de Cyberneticos (proveedor de hosting de LaWebera.es). Cyberneticos está ubicado en España, UE, un país cuyos nivel de protección son adecuados según Comisión de la UE. Ver política de privacidad de Cyberneticos.
El hecho de que no introduzcas los datos de carácter personal que aparecen en el formulario como obligatorios podrá tener como consecuencia que no pueda atender tu solicitud.
Podrás ejercer tus derechos de acceso, rectificación, limitación y suprimir los datos en admin@lawebera.es así como el derecho a presentar una reclamación ante una autoridad de control.
Puedes consultar la información adicional y detallada sobre Protección de Datos en mi página web: www.lawebera.es, así como consultar mi política de privacidad.
Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.