Artigo Java Magazine 54 - Javascript Fácil com jQuery

Javascript Fácil com jQuery

Parte 1: Trabalhando com elementos no DOM

Conheça a poderosa biblioteca jQuery e seus mecanismos para facilitar e reduzir o trabalho com javascript em suas aplicações web

jQuery é uma biblioteca javascript open source que oferece uma grande variedade de funcionalidades, além de uma sintaxe fácil de aprender. A sua robusta compatibilidade permite que as aplicações funcionem nos browsers mais comuns e ainda possui centenas de plugins que estendem o seu núcleo, fazendo desta uma ferramenta essencial para qualquer desenvolvedor web.

O arquivo para produção possui apenas 26kb (versão 1.2.1 empacotada), o qual pode ser baixado do site jquery.com. Basta incluir esse arquivo no seu site e você já está pronto para começar. O site também oferece o código completo da biblioteca (legível e comentado) num arquivo de 77kb, caso você queira estudar ou modificar o código.

O que a biblioteca jQuery é capaz de fazer?

jQuery é uma biblioteca genérica para se trabalhar com javascript e ainda possui a capacidade de ser estendida para a criação de plugins. O núcleo dessa biblioteca está preparado para:

1.      Acessar partes de uma página: sem uma biblioteca, é comum precisarmos de muitas linhas de código para operar na árvore de elementos do DOM (Document Object Model). A jQuery possui mecanismos fáceis e rápidos para atingir esse objetivo.

2.      Modificar a aparência de uma página: a jQuery integra as vantagens do CSS (Cascading Style Sheets) com o poder do javascript. Isso significa que podemos mudar as classes e estilos dos elementos mesmo após o carregamento da página.

3.      Alterar o conteúdo de uma página: é possível modificar um documento com poucas linhas de código. Assim, textos podem ser mudados, imagens podem ser inseridas ou trocadas, listas podem ser reordenadas ou todo documento pode ser reescrito.

4.      Criar interação com os usuários: a jQuery possui uma forma elegante de interceptar eventos criados pelo usuário, como cliques ou teclas pressionadas, sem poluir o HTML da página. Além disso, esse tratamento de eventos elimina as inconsistências entre os browsers, o que é um sério problema para os desenvolvedores web.

5.      Adicionar animação a uma página: animações são ótimos recursos para evitar transições bruscas no visual de uma página. A biblioteca possui um conjunto de efeitos prontos, como desbotamento (fade) ou deslizamento (slide), além de ser possível criar efeitos personalizados.

6.      Comunicar com o servidor sem recarregar a página: A parte de AJAX também está bem integrada com as outras funcionalidades, o que permite criar páginas dinâmicas e com melhor usabilidade.

7.      Simplificar tarefas comuns de javascript: A biblioteca possui melhorias para as construções do javascript, como iteração e manipulação de arrays.

Este artigo está idido em duas partes. Nessa primeira parte abordamos dos tópicos 1 ao 3, o que já significa bastante funcionalidade. A segunda parte do artigo explica os tópicos 4, 5, 6 e 7, além de fornecer outros detalhes sobre plugins e projetos de extensão.