¿Cómo accedo a las propiedades de estilo de los pseudo-elementos con jQuery?

Por contexto, este es un seguimiento de una pregunta anterior . En lugar de cssRules en cssRules , me gustaría basar la lógica en los selectores jQuery que buscan los efectos de esas reglas.

Dadas las propiedades predeterminadas de

 .commentarea .author:before { background-image: url(http://...); background-position: -9999px -9999px; /* ... */ } 

que se modifican selectivamente como en

 .author[href$="gbacon"]:before /* ... */ { content: ""; background-position: 0 -140px } 

¿Cómo puedo seleccionar pseudoelementos cuyas posiciones de fondo respectivas tengan valores predeterminados? Copiando el selector como en

 GM_log("size = " + $(".commentarea .author:before").size()); 

no coincide con nada. Probando .siblings() con

 $(".commentarea .author") .map(function(i) { GM_log($(this) .siblings() .map(function (i) { return $(this).css("background-image") }) .get() .join(", ")) }); 

produce solo none valores.

Para más detalles, mira la página en vivo . es posible?

No puede usar los pseudo-elementos :before y :after como este. El objective de ellos es insertar contenido antes y después (respectivamente) del selector que ha especificado.

Ejemplo de uso:

HTML:

  Outer  Inner   

CSS:

 .a .b:before { content: "|Inserted using :before|"; } .a { color: blue; } .b { color: red; } 

Resultado:

http://jsfiddle.net/mzcp6/

Lo que sucedió fue que el texto |Inserted using :before| fue insertado antes (bueno, realmente, antepuesto) al lapso interno porque era clase b y un descendiente de un elemento de clase a . Básicamente,: :before y :after no seleccionar; ellos se modifican

Ejemplo:

Esto no funciona como se esperaba

HTML:

  

More text

More text

Inner

CSS:

 .a .b:before { text-size: 100px; } 

No pasa nada:

http://jsfiddle.net/bQ2ty/

EDITAR:

:before no es un selector jQuery válido: http://api.jquery.com/category/selectors/

Creo que deberá usar algo que no sea :before o intente extraer la regla original utilizando el complemento jQuery: http://flesler.blogspot.com/2007/11/jqueryrule.html

Aquí hay una solución que usa javascript simple:

 // Get the color value of .element:before var color = window.getComputedStyle( document.querySelector('.element'), ':before' ).getPropertyValue('color'); // Get the content value of .element:before var content = window.getComputedStyle( document.querySelector('.element'), ':before' ).getPropertyValue('content');