Introdução Ao Jquery

O documento apresenta uma introdução ao jQuery, uma biblioteca de JavaScript que facilita a construção de páginas web, destacando suas vantagens como produtividade e compatibilidade. O curso é dividido em teoria e prática, com pré-requisitos em XHTML, CSS e JavaScript. Além disso, aborda a instalação do jQuery e modelos de programação recomendados para manter a separação entre HTML e JavaScript.

Enviado por

djivetayane01

Direitos autorais

Levamos muito a sério os direitos de conteúdo. Se você suspeita que este conteúdo é seu, reivindique-o aqui.

Formatos disponíveis

Baixe no formato DOCX, PDF, TXT ou leia on-line no Scribd

0% acharam este documento útil (0 voto)

0 visualizações3 páginas

Introdução Ao Jquery

Enviado por

djivetayane01

Direitos autorais

Levamos muito a sério os direitos de conteúdo. Se você suspeita que este conteúdo é seu, reivindique-o aqui.

Formatos disponíveis

Baixe no formato DOCX, PDF, TXT ou leia on-line no Scribd

Você está na página 1/ 3

1.

Introdução ao jQuery: Construindo Páginas Web de Forma Eficiente

Tecnologias Fundamentais
A construção de páginas web é baseada em três tecnologias principais:
 XHTML: Utilizado para a marcação semântica do conteúdo.
 CSS: Define o estilo visual, como cores e espaçamento.
 JavaScript: Proporciona interatividade nas páginas.
O que é jQuery?
jQuery é uma biblioteca de JavaScript que simplifica o desenvolvimento. Criada em 2006,
sua proposta é "Escreva menos, faça mais", permitindo que desenvolvedores manipulem o
DOM e eventos de forma mais eficiente.
Recursos e Documentação
A biblioteca pode ser acessada em jquery.com(https://jquery.com), onde é possível baixar,
encontrar tutoriais e plugins. A documentação é bem estruturada, facilitando o aprendizado e
uso.
Estrutura do Curso
O curso é dividido em duas partes:
 Teoria: Sintaxe e manipulação de elementos.
 Prática: Exercícios como criação de menus e slides.
Pré-requisitos
Para aproveitar o curso, é necessário conhecimento prévio em XHTML, CSS e JavaScript.
Cursos introdutórios estão disponíveis gratuitamente.
Vantagens de Utilizar jQuery
 Produtividade: Reduz a quantidade de código necessário.
 Gratuidade: Licença livre, permitindo uso em projetos pessoais e comerciais.
 Popularidade: Comunidade ativa que contribui para melhorias contínuas.
 Compatibilidade: Uniformiza o comportamento em diferentes navegadores.
Conclusão
jQuery é uma ferramenta poderosa e amigável, essencial para quem deseja criar aplicações
web de qualidade, unindo eficiência e facilidade de uso. O próximo passo no curso abordará a
instalação do jQuery e suas diferenças em relação ao JavaScript puro.
2. Introdução ao jQuery
Instalação da biblioteca jQuery
Para instalar a biblioteca jQuery no seu projeto HTML, siga os seguintes passos:
 Crie um diretório chamado 'jquery' no seu computador.
 Crie um arquivo chamado 'aula1.html' dentro do diretório 'jquery' com a seguinte
estrutura:
<!DOCTYPE html>
<html>
<head>
<title>Aula 1 de jQuery</title>
<script src='js/jquery.min.js'></script>
</head>
<body>
<h1>Título</h1>
<a href='#' onclick='alterarTitulo()'>Clique aqui</a>
<script>
function alterarTitulo() {
document.getElementById('titulo').style.color = 'blue';
}
</script>
</body>
</html>
 Na tag <head>, adicione o script da biblioteca jQuery, indicando o caminho relativo
do arquivo 'jquery.min.js' dentro do diretório 'js'.
 Você pode baixar a biblioteca jQuery no site oficial (jquery.com) e salvar o arquivo
'jquery.min.js' dentro do diretório 'js'.
Diferentes formas de programação em JavaScript
Modelo inline (inadequado)
<a href='#' onclick='alert('Olá, mundo!')'>Clique aqui</a>
Esse modelo não é recomendado porque mistura marcação HTML com código JavaScript,
violando os padrões web.
Modelo com função externa
<script>
function alterarTitulo() {
document.getElementById('titulo').style.color = 'blue';
}
</script>
<a href='#' onclick='alterarTitulo()'>Clique aqui</a>
Esse modelo é um pouco melhor, mas ainda mistura JavaScript com HTML.
Modelo jQuery
<script>
$(document).ready(function() {
$('a').click(function() {
$('#titulo').css('color', 'blue');
});
});
</script>
Este modelo é o mais recomendado porque separa completamente a marcação HTML do
código JavaScript, seguindo os padrões web.
Vantagens do jQuery
 Sintaxe mais simples e intuitiva, especialmente para quem conhece HTML e CSS.
 Separação clara entre marcação HTML e código JavaScript, seguindo os padrões web.
 Permite selecionar elementos HTML usando seletores CSS, tornando o código mais
fácil de ler e manter.
 Fornece uma ampla variedade de funções para manipulação de DOM, eventos e
animações.