Otros usos de la función $() - II

Función jQuery pasando elementos

Otro posible valor que se le puede enviar a la función jQuery es un elemento o una jerarquía de elementos del DOM, para extenderlos con las funcionalidades que aporta el framework para los elementos. Por ejemplo:

var documento = $(document.body);
documento.css("background-color", "#ff8833");

Con la primera línea creamos una variable llamada documento, a la que asignamos el valor que devuelve el método $() enviando el parámetro document.body. 

Nota: La variable document.body corresponde con un elemento del DOM de Javascript, que crea automáticamente el navegador y hace referencia al documento de la página. 

Con ello obtenemos un objeto que es el cuerpo de la página (document.body) al que le hemos agregado todas las funcionalidades del framework jQuery para los elementos. Así pues, en la línea siguiente, invocamos el método css() sobre la variable "documento", que es el propio documento de la página extendido. Por eso el método css(), que es de jQuery(), funciona sobre ese objeto. Algo como esto no funcionaría porque estaríamos intentando lanzar un método de jQuery directamente sobre el objeto DOM sin haberlo extendido:

document.body.css("background-color", "#ff8833");

No funcionará porque no podemos llamar a un método jQuery sobre un objeto DOM, si es que no lo hemos extendido con la función $(). 

Nota: Esta función acepta documentos XML y objetos Window, aunque no son propiamente elementos del DOM. 

Podemos ver ahora una página donde se encuentra este ejemplo en marcha.