Selecionar elementos através de seletores Css trabalhando com esses elementos. No exemplo abaixo foi o
seletor h1. Pode-se fazer outras operações com esses elementos também.
$("#titulo").css("color", "#0000FF"); //modifica a cor
$("#titulo").text("Curso de jQuery"); //substitui o texto
$("#titulo").hide(); //esconde o texto
$("#titulo").fadeToggle(); //mostra ou esconde um elemento
Pode-se executar várias operações no mesmo conjunto de elementos, não sendo necessário selecioná-los novamente.
<head>
<title>JQuery (Filosofia e Organização)</title>
script type= "text/javascript" src= "js/jquery-1.5.2.min.js"></script>
<script type= "text/javascript">
$(document).ready(function(){
$("a").click(function(){
$("#titulo").css("color", "#0000FF").text("Curso de jQuery").hide().fadeToggle();
//nesse exemplo várias funções foram encadeadas, uma após a outra, selecionando o elemento título apenas uma vez.
O código fica menor e o efeito é o mesmo.
As instruções também podem ser colocadas uma embaixo da outra:
$("#titulo")
.css("color", "#0000FF")
.text("Curso de jQuery")
.hide()
.fadeToggle();
});
});
</script>
</head>
Ao executar a função css, text ou hide, está sendo executado funções da Biblioteca javaScript em cima de um elemento Dom. Recupera-se o elemento Dom com #("titulo"), mas o elemento está encapsulado com todas as funcionalidades da biblioteca jQuery.
Loop ou repetição. Permite a execução de uma mesma operação num conjunto de elementos, sem precisar fazer explicitamente uma iteração, como um for ou for it
No javaCript:
<head>
<title>JQuery (Filosofia e Organização)</title>
script type= "text/javascript" src= "js/jquery-1.5.2.min.js"></script>
<script type= "text/javascript">
$(document).ready(function(){
$("a").click(function(){
$("a").css("color", "red");
$("a").click(function(){
$("#titulo").css("color", "#0000FF").text("Curso de jQuery").hide().fadeToggle();
});
});
</script>
</head>
No Html; <body> <h1 id="titulo"> Hello World!</h1> <a href="#" >Executar javaScript</a> <a href="#" >Executar um</a> <a href="#" >Executar dois</a> </body>
Em docs.jQuery existe a referência de como essa Api está organizada.
Por exemplo em jQuery Core, que é o núcleo da api, está o modo de trabalhar com plugins, com dados, interopatibilidade entre a biblioteca e outras bibliotecas.
Os seletores vão trazer os conceitos básicos de como selecionar elementos, filtrar elementos, filtrar conteúdo, filtros de formulários, filtro de visibilidade, tudo que é possível fazer com seletores Css3 está sendo abrangido neste item.
Na área atributos, está como selecionar atributos, valores de um elemento, atributos html, atributos de classe.
Esta palavra quer dizer percurso e permite fazer busca, encadeamento, filtragem que é o caminho para acesso e operaçao de um determinado elemento.
Modificação do conteúdo, ou seja, remoção ou cópia do conteúdo, inserção dentro e fora do conteúdo, substituição do conteúdo.
Em css serão vistos: posicionamento, altura, largura, estilo, etc.
Carregamento de páginas, eventos dinâmicos enfim, os manipuladore de eventos serão tratados aqui.
Alteração de degradée, ocultar e apresentar, efeito de deslizar, efeito de explodir são alguns dos efeitos que podem ser conseguidos através de effects
Eventos, requisições de ajax. A Api jQuery possui um recurso que permite o acesso a um web service remoto usando ajax. Como foi visto existe algumas restrições na linguagem javaScript para se fazer um acesso a um recurso de ajax, que não esteja no mesmo contexto do portal, nesse caso existe solução para contornar o problema.
Pemitem descobrir características dos navegadores. Operações com array, strings, urls, objetos,