O que é jQuery? Um Tok em umas das bibliotecas JavaScript mais usada da Web

Quer dominar jQuery, mas ainda não está familiarizado com JavaScript? Não se preocupe! Comece sua jornada agora mesmo clicando aqui e descubra como fazer a web ganhar vida!

jQuery – Write Less, Do More

A biblioteca é um projeto da Fundação JavaScript, surgiu como resposta à necessidade de simplificar os scripts interpretados no client-side. Seu objetivo principal é capacitar os desenvolvedores a alcançarem mais com menos esforço, adotando o lema “Write Less, Do More” (Escreva menos, faça mais) como mantra da comunidade.

Com o jQuery, tarefas que normalmente exigiriam longos e complexos blocos de código podem ser simplificadas para uma única linha. Desde a implementação de efeitos visuais dinâmicos até a manipulação de eventos interativos, essa biblioteca possibilita que os desenvolvedores atinjam seus objetivos de forma rápida e eficiente, ao mesmo tempo que promove a escrita de código mais limpo, legível e conciso. Isso resulta em uma compreensão aprimorada do código para todos os envolvidos no projeto.

Demostração

// Em JavaScript puro
var botaoOcultar = document.getElementById('ocultarConteudo');
var conteudoDiv = document.querySelector('.conteudo');

botaoOcultar.addEventListener('click', function() {
  if (conteudoDiv.style.display === 'none') {
    conteudoDiv.style.display = 'block';
  } else {
    conteudoDiv.style.display = 'none';
  }

Minha div .conteudo

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

// Em jQuery 
$("#ocultarConteudo").click(function() {
  $(".conteudo").toggle();
});

Demostração

Minha div .conteudo

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Suas principais Funcionalidades

  • Resolução da incompatibilidade entre os navegadores.
  • Redução de código para otimização e desempenho.
  • Reutilização do código através de plugins.
  • Integração com uma vasta quantidade de plugins criados por outros desenvolvedores.
  • Facilidade para acessar e manipular o DOM de forma simplificada.
  • Compatibilidade com AJAX (Asynchronous JavaScript And XML) para comunicação assíncrona com o servidor.
  • Implementação segura de recursos do CSS1, CSS2 e CSS3 para garantir consistência visual e comportamento.
  • Adoção de programação encadeada, em que cada método retorna um objeto, para melhor legibilidade e manutenção do código.

Seletores

No jQuery, os filtros são métodos que permitem selecionar elementos específicos de um conjunto de elementos correspondentes a um seletor. Eles são úteis para refinar a seleção de elementos, permitindo escolher elementos com base em diferentes critérios, como classe, ID, atributos, etc.

$(“*”)Seleciona todos os elementos da página.
$(this)Seleciona o elemento atual que será manipulado dentro de uma função.
$(“p”)Seleciona todas as instâncias da tag < p >.
$(“.example”)Seleciona todos os elementos com a classe “example” aplicada.
$(“[type=’text’]”)Seleciona qualquer elemento com o atributo type aplicado como “text”.
$(“p:first-of-type”)Seleciona o primeiro elemento < p > encontrado na página.

Verifica se pelo menos um dos elementos selecionados possui a classe especificada.

var hasMenuClass = $("#m2").hasClass("menu");

Remove elementos indesejados com base em uma função que retorna true para os elementos desejados e false para os indesejados.

$("p").filter(function(i) {
  return i === 3;
});

Retorna um array de valores, onde cada valor está ligado a um elemento selecionado. Os valores são retornados pela função passada como parâmetro.


var ids = $("div").map(function() {
  return $(this).attr("id");
});

Esses são apenas alguns exemplos de filtros que você pode usar no jQuery para interagir com os elementos da página de forma mais simples.


Veja na documentação oficial do jQuery mais exemplos

Adicionar um comentário