A partir de agora as páginas terão o javaScript separado. Para isso foi criado um diretório dentro de js, com o nome aula, e dentro desse diretório ficarão todas as páginas de script. Para acessar:
No html: <head> <title>JQuery - Seletores Simples</title> <link rel="stylesheet" type="text/css" href="/static/css/style_jQuery.css" /> <script type= "text/javascript" src= "/static/js/jquery.min.js"></script> <script type= "text/javascript" src="js/aula/seletores.js"></script> </head>
Os seletores jQuery são utilizados para encontrar e também para acessar elementos em um documento Html. Através da jQuery pode-se executar operações em cima desses elementos.
O seletor asterisco é aplicado em todos os elementos.
no javaScript:
$(document).ready(function(){
//$("*").css("color", "#0000FF"); //aqui a cor é aplicada em todos os seletores
$("#titulo").css("color", "green"); //nesse caso a cor é aplicada somente no id titulo
});
Para acessar um elemento com uma classe específica, basta colocar
ponto (.) e o nome da classe:
No Html:
<a href="#" class="teste">Executar javaScript</a>
No javaScript:
$(document).ready(function(){
$(".teste").css("color", "red");//teste, nome da classe
});
Para acessar todos os elementos com a tag a
No javaScript:
$(document).ready(function(){
//$("*").css("color", "#0000FF");
$("a").css("color", "brown");
});
Esses são os Seletores Simples da biblioteca jQuery que são encontrados no Css.
Seletores que retornam grupos de elementos
No javaScript:
$(document).ready(function(){
$("h1, a").css("background-color", "gray");
});