Seletores DOM JavaScript / jQuery

jQuery vs JavaScript

O jQuery foi criado por John Resig em 2006. Ele visa lidar com incompatibilidade de navegadores e simplificar operações no DOM HTML, tratamento de eventos, animações e Ajax.

Durante mais de uma década, o jQuery tem sido a biblioteca JavaScript mais popular do mundo.

No entanto, desde a versão 5 do JavaScript (2009), a maioria das utilidades do jQuery pode ser resolvidas com algumas linhas de JavaScript padrão:

Procurar elementos HTML por id

Retorna o elemento com id="intro":

jQuery

var myElement = $("#id01");

Experimente você mesmo

JavaScript

var myElement = document.getElementById("id01");

Experimente você mesmo

Procurar elementos HTML por nome de tag

Retorna todos os elementos <p>:

jQuery

var myElements = $("p");

Experimente você mesmo

Exemplo

var myElements = document.getElementsByTagName("p");

Experimente você mesmo

Encontrar elementos HTML através de nomes de classe

Retorna todos os elementos com class="intro".

jQuery

var myElements = $(".intro");

Experimente você mesmo

JavaScript

var myElements = document.getElementsByClassName("intro");

Experimente você mesmo

Seletores de classe não funcionam no Internet Explorer 8 e versões anteriores.

Encontrar elementos HTML através de seletores CSS

Retorna uma lista de todos os elementos <p> com class="intro".

jQuery

var myElements = $("p.intro");

Experimente você mesmo

JavaScript

var myElements = document.querySelectorAll("p.intro");

Experimente você mesmo

querySelectorAll() Métodos não funcionam no Internet Explorer 8 e versões anteriores.