selectores - Regla de CSS basada en el contenido

selectores css

Question

Esta pregunta ya tiene una respuesta aquí:

• ¿Hay un selector de CSS para los elementos que contienen cierto texto? 13 respuestas

Me gustaría aplicar un estilo diferente a todos los anclajes que contienen una palabra específica. ¿Se puede hacer en CSS puro? Está bien si es solo CSS3.

Answer 1

@bobince ayúdame y escribí este código:

var x = document.getElementsByTagName(''TD'');
for (var i= x.length; i-->0;)
    if (x[i].innerHTML==''closed'')
        x[i].parentNode.style.background= ''#FEE'';

Si el contenido de algunos TD está " cerrado ", el color de fondo del TR se identificará con un color rojo claro.

Answer 2

Sin embargo, puede hacer coincidir los valores de los atributos . Si usa atributos de datos personalizados, puede obtener lo que desea.

Answer 3

Usa el Hitch que es una pequeña biblioteca JS. Puede aplicar fácilmente el estilo basado en contenido a cualquier elemento. Tiene muchas opciones y es ideal para un estilo condicional.

Answer 4

sí hay un selector :contains en CSS3.

li:contains("special"){text-style: italic;}

se menciona aproximadamente 1/2 abajo en esta página here

Esto es algo que también puedes hacer con jQuery ...

Answer 5

No :contains fue propuesto una vez, pero no está en el Borrador de Trabajo actual de Selectores de CSS3.

Necesitarías algo de JavaScript, por ejemplo:

for (var i= document.links.length; i-->0;)
    if (//bSpecificWord/b/i.test(document.links[i].innerHTML)
        document.links[i].style.color= ''red'';