Front End

29 jul, 2019

Biblioteca JQUERY – Instalação

100 visualizações
Publicidade

Antes de instalarmos esta rica biblioteca você precisa saber o que é Jquery e o trecho abaixo encontrado no Wiki fará com que você entenda mais sobre o assunto:

# jQuery

Origem: Wikipédia, a enciclopédia livre.

Agora que você entendeu o que é Jquery, vamos à instalação.

# Instalando

O primeiro passo para instalarmos a biblioteca, é fazendo download da ultima versão dela a partir do website original: http://jquery.com/

Após realizado o download, crie uma estrutura de pastas que ajudará a organização do seu projeto e a instalação correta. Lembre-se que um projeto organizado é essencial para um melhor desempenho no desenvolvimento e manutenção de qualquer projeto, como eu descrevi no artigo que abordo organização e apis.

Para que tudo funcione e você possa testar, preparei um exemplo que fará com que você entenda de modo didático como organizar. Veja abaixo o exemplo:

– Raiz
|— index.html

|— js/ (diretorio)

|— jquery.js (arquivo baixado que foi renomeado)
|— css/ (diretorio)
|— outras pastas ou arquivos..

Agora o que você já organizou o nosso projeto e salvou o arquivo baixado que foi renomeado para jquery.js. Abra o arquivo index.html e dentro da tag **< head >** faça a chamada do arquivo baixado através do elemento **< script >** . Para melhor entender, veja como o exemplo abaixo ficou:

Dentro do arquivo **index.html** iremos fazer a chamada do nosso arquivo **.js**.

**Exemplo**

```
<html>

<head>
<script type="text/javascript" src="js/jquery.js"></script>
</head>

<body>
Aprendendo jQuery.
</body>

</html>
```

Pronto 😉

A partir de agora você já pode utilizar todos os recursos da biblioteca oficialmente. Separei algumas funcionalidades para você estudar:

“`
.add() // Crie um novo objeto jQuery com elementos adicionados ao conjunto de elementos correspondentes.

.addBack() // Adicione o conjunto anterior de elementos na pilha ao conjunto atual, filtrado opcionalmente por um seletor.

.addClass() // Adiciona as classes especificadas a cada elemento no conjunto de elementos correspondentes.

.after() // Inserir conteúdo, especificado pelo parâmetro, após cada elemento no conjunto de elementos correspondentes.

.ajaxComplete() // Registre um manipulador a ser chamado quando as solicitações do Ajax forem concluídas. Este é um AjaxEvent.

.ajaxError() // Registre um manipulador a ser chamado quando as solicitações do Ajax forem concluídas com um erro. Este é um evento do Ajax.

.ajaxSend() // Anexe uma função a ser executada antes que uma solicitação Ajax seja enviada. Este é um evento do Ajax.

.ajaxStart () // Registre um manipulador a ser chamado quando a primeira solicitação do Ajax for iniciada. Este é um evento do Ajax.

.ajaxStop()
Registre um manipulador a ser chamado quando todas as solicitações do Ajax forem concluídas. Este é um evento do Ajax.

.ajaxSuccess() // Anexe uma função a ser executada sempre que uma solicitação do Ajax for concluída com sucesso. Este é um evento do Ajax.

.andSelf() // Adicione o conjunto anterior de elementos na pilha ao conjunto atual.

.animar() // Execute uma animação personalizada de um conjunto de propriedades CSS.

.animar() // Execute uma animação personalizada de um conjunto de propriedades CSS.

:animated Selector // Selecione todos os elementos que estão no progresso de uma animação no momento em que o seletor é executado.

.append() // Inserir conteúdo, especificado pelo parâmetro, no final de cada elemento no conjunto de elementos correspondentes.

Para encontrar mais, acesse o site oficial: https://jquery.com/