cómo obtener todos los estilos calculados de un elemento con jQuery?

Quiero copiar todos los css calculados de un elemento y aplicarlo a otro elemento. Por estilo calculado, quiero decir, por ejemplo, si el ancho del elemento es 100%, pero su ancho es 200px, el ancho de los elementos calculados sería 200px. ¿Cómo puedo acceder a todos estos estilos para un elemento?cómo obtener todos los estilos calculados de un elemento con jQuery?

Fuente

2010-01-28 hakim-sina

Encontró una respuesta que da * cada * declaración de estilo [aquí] (http://stackoverflow.com/questions/2558426/getcomputedstyle-or-cssmap- to-get-every-style-declaration # answer-2561294), que creo que es lo que el OP dijo que buscaban. – Barney

después de más investigaciones utilizando la respuesta de Majid, descubrí que ".css" retorno método de jQuery calcula estilo también, y es mejor porque representa la diferencia de navegador http://api.jquery.com/css/

Fuente

2010-01-28 01:34:54

¡Sí! ¡Tonto de mí! ¿Por qué traté de llevar la cuchara a la boca tomando esa larga ruta? La moral de la historia: antes de buscar en otra parte siempre revise las herramientas que ya tiene. –

@ hakim-sina ¿Puedes explicar esto? No entiendo cómo obtener el estilo calculado aquí con 'css()' de jQuery. – Smamatti

@ Smamatti: ¿puede ser más específico? en general, para obtener un estilo calculado, por ejemplo ancho (el ejemplo que se menciona arriba en la pregunta), todo lo que necesita hacer es pasarlo a la función CSS así: var ancho = $ ("elemento"). css ("ancho") –

Utilice el estilo calculado. Aquí hay un tutorial simple: Get Computed Style

Y en cuanto a jquery, puede ayudarlo a obtener una referencia al elemento de origen y de destino, y aplicar fácilmente la regla css. digamos que usted está interesado sólo en dos propiedades, la anchura y la altura, entonces se puede usar el código en la línea de:

var oSource = $('#source'); 
var sWidth = document.defaultView.getComputedStyle(oSource, null).width; 
var sHeight = document.defaultView.getComputedStyle(oSource, null).height; 
$('#target').css('width', sWidth).css('height', sHeight);

Fuente

2010-01-28 00:59:33

muchas gracias. Creo que tengo que usarlo con currentStyle para soportar IE también, ¿sí? –

No estoy seguro acerca de i.e 7, consulte este enlace sobre compatibilidad: http://www.quirksmode.org/dom/w3c_css.html –

@ hakim-sina En lugar de hacer cosas diferentes, ¿por qué no utilizar jQuery u otra biblioteca? – NoBugs

cómo obtener todos los estilos calculados de un elemento con jQuery?

Respuesta

Cuestiones relacionadas