JavaScript / jQuery DOM Selectors

jQuery vs JavaScript

jQuery was created by John Resig in 2006. It is designed to handle browser incompatibilities and simplify HTML DOM operations, event handling, animations, and Ajax.

For more than a decade, jQuery has been the most popular JavaScript library in the world.

However, after JavaScript Version 5 (2009), most jQuery utilities can be solved with a few lines of standard JavaScript:

Find HTML elements by id

Return element with id="intro":

jQuery

var myElement = $("#id01");

Probeer het zelf

JavaScript

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

Probeer het zelf

Find HTML elements by tag name

Return all <p> elements:

jQuery

var myElements = $("p");

Probeer het zelf

Voorbeeld

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

Probeer het zelf

HTML-elementen vinden op basis van klasse

Geef alle elementen met class="intro" terug.

jQuery

var myElements = $(".intro");

Probeer het zelf

JavaScript

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

Probeer het zelf

Elementen vinden op basis van klasse werkt niet in Internet Explorer 8 en oudere versies.

HTML-elementen vinden met CSS-selectors

Geef een lijst van alle <p>-elementen met class="intro" terug.

jQuery

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

Probeer het zelf

JavaScript

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

Probeer het zelf

querySelectorAll() Methoden werken niet in Internet Explorer 8 en oudere versies.