Évènements

// jQuery
$(document).ready(function() {
  // code
})

// Vanilla
document.addEventListener('DOMContentLoaded', function() {
  // code
})
// jQuery
$('a').click(function() {
  // code…
})

// Vanilla
[].forEach.call(document.querySelectorAll('a'), function(el) {
  el.addEventListener('click', function() {
    // code…
  })
})
Sélecteurs

// jQuery
var divs = $('div')

// Vanilla
var divs = document.querySelectorAll('div')
// jQuery
var newDiv = $('
') // Vanilla var newDiv = document.createElement('div') Attributs // jQuery $('img').filter(':first').attr('alt', 'My image') // Vanilla document.querySelector('img').setAttribute('alt', 'My image') Classes // jQuery newDiv.addClass('foo') // Vanilla newDiv.classList.add('foo') // jQuery newDiv.toggleClass('foo') // Vanilla newDiv.classList.toggle('foo') Manipulation // jQuery $('body').append($('

')) // Vanilla document.body.appendChild(document.createElement('p')) // jQuery var clonedElement = $('#about').clone() // Vanilla var clonedElement = document.getElementById('about').cloneNode(true) // jQuery $('#wrap').empty() // Vanilla var wrap = document.getElementById('wrap') while(wrap.firstChild) wrap.removeChild(wrap.firstChild) Navigation // jQuery var parent = $('#about').parent() // Vanilla var parent = document.getElementById('about').parentNode // jQuery if($('#wrap').is(':empty')) // Vanilla if(!document.getElementById('wrap').hasChildNodes()) // jQuery var nextElement = $('#wrap').next() // Vanilla var nextElement = document.getElementById('wrap').nextSibling AJAX GET // jQuery $.get('//example.com', function (data) { // code }) // Vanilla var httpRequest = new XMLHttpRequest() httpRequest.onreadystatechange = function (data) { // code } httpRequest.open('GET', url) httpRequest.send() POST // jQuery $.post('//example.com', { username: username }, function (data) { // code }) // Vanilla var httpRequest = new XMLHttpRequest() httpRequest.onreadystatechange = function (data) { // code } httpRequest.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded') httpRequest.open('POST', url) httpRequest.send('username=' + encodeURIComponent(username)) JSONP // jQuery $.getJSON('//openexchangerates.org/latest.json?callback=?', function (data) { // code }) // Vanilla function success(data) { // code } var scr = document.createElement('script') scr.src = '//openexchangerates.org/latest.json?callback=formatCurrency' document.body.appendChild(scr)