Home
índice
Página anterior

Seletores de Conteúdo

Na Biblioteca jQuery Seletors Contens Filter, estão disponíveis os seguintes seletores de conteúdo:

• :contains() Selector

Procura todos elementos que tenham um texto específico.

No javaScript:
$(document).ready(function(){
$("td:contains(Fiat)") //aqui ficarão coloridos os espaços com o nome fiat
.css("background", "#CCC");
});

• :has() Selector

Busca elementos com uma tag específica ou elemento dentro dele.

$(document).ready(function(){
$("td:has(strong)")
.css("background", "#CCC");
});

• :empty Selector

Procura todos elementos sem texto.

No javaScript:
$(document).ready(function(){
$("td:empty") //aqui ficarão coloridos os espaços vazios
.css("background", "#CCC");
});

• Células preechidas

$(document).ready(function(){
$("td:not(td:empty)")
.css("background", "#CCC");
});

• :parent Selector

Busca todos os elementos pais de outros elementos.

	No Html:
	 <table border="1">
	 <thead>
	   <tr>
		<th scope="row">Carro</th>
		<td>Marca</td>
		<td>Cor</td>
	   </tr>
	 
	   </thead> 
	   
	   </tbody> 
	 
	   <tr>
		<th scope="row">Uno</th>
		<td>Fiat</td>
		<td>Azul</td>
	   </tr>
	    
	   <tr>
		<th scope="row">Pálio</th>
		<td>Fiat</td>
		<td>Prata</td>
	   </tr>
	    
	   <tr>
		<th scope="row">Gol;/th>
		<td>Volkswagem</td>
		<td>Preto</td>
	   </tr>
	    
	   <tr>
		<th scope="row">Fiesta</th>
		<td>Ford</td>
		<td>Prata</td>
	   </tr>
	   
	   <tr>
		<th scope="row">Parati</th>
		<td><strong>Volkswagem</td>
		<td>Beige</td>
	   </tr>
	   </table>
	 
	 

Carro	Marca
Uno	Fiat	Azul
Pálio	Fiat	Prata
Gol	Volkswagem	Preto
Fiesta	Ford	Prata
Parati	Volkswagem	Beige
Fiesta	Ford	Preto