Contenido

cssQuery, getElementsByTagName? Pah!

5 oct

+ 2

getElementsByTagName? Pah!

Con esta frase tan descriptiva  se presenta cssQuery() una función javascript con la que podrás asignar propiedades CSS a los elementos del DOM de forma muy rápida.

Compatible con todos los navegadores

  • Microsoft Internet Explorer 5+ (Windows)
  • Microsoft Internet Explorer 5.2 (Mac)
  • Firefox/Mozilla 1.6+
  • Opera 7+
  • Netscape 6+
  • Safari 1.2

Selectores permitidos

 *  E
 E F
 E > F
 E + F  E ~ F
 E.warning  E#myid
 E:link  E:first-child
 E:last-child  E:nth-child(n)
 E:nth-last-child(n)  E:only-child
 E:root  E:lang(fr)
 E:target  E:enabled
 E:disabled  E:checked
 E:contains(“foo”)  E:not(s)
 E[foo]  E[foo=”bar”]
 E[foo~=”bar”]  E[foo^=”bar”]
 E[foo$=”bar”]  E[foo*=”bar”]
 E[foo|=”bar”]  

 

Ejemplos de uso

// Todos los parrafos que se encuetren
//  dentro del tag body
var tags = cssQuery("body > p");

// Todos los elementos con el atributo href
var tags = cssQuery("[href]");

// Todos los enlaces cuyo atributo href sea igual a #
var tags = cssQuery("a[href='#']");
// Todas las imagenes dentro de los enlaces anteriores
var images = cssQuery("img", tags);

// Busca todos los tipos de listas
var tags = cssQuery("dl,ol,ul");

// Busca dentro de un XML externo
var tags = cssQuery("my|:root>my|link", myXMLDoc);

// complicando la llamada :D
var complex = "p>a:first-child+input[type=text]~span";
var tags = cssQuery(complex); 

Descargar y Demo

Comentar

#

Me reservo el derecho de eliminar y/o modificar los comentarios que contengan lenguaje inapropiado, spam u otras conductas no apropiadas en una comunidad civilizada. Si tu comentario no aparece, puede ser que akismet lo haya capturado, cada día lo reviso y lo coloco en su lugar. Siento las molestias.