Skip to content

Instantly share code, notes, and snippets.

@imcarlosdev
Forked from joyrexus/README.md
Created December 31, 2018 08:28
Show Gist options
  • Save imcarlosdev/5b06fbe0fb39ffb809eefe94ded60f93 to your computer and use it in GitHub Desktop.
Save imcarlosdev/5b06fbe0fb39ffb809eefe94ded60f93 to your computer and use it in GitHub Desktop.
Vanilla JS equivalents of jQuery methods

jQuery | Vanilla

$(document).ready(function() { }); | document.addEventListener("DOMContentLoaded", function() { }); var divs = $("div"); | var divs = document.querySelectorAll("div"); var newDiv = $("

"); | var newDiv = document.createElement("div");

// jQuery newDiv.addClass("foo");

// Vanilla newDiv.classList.add("foo");

// jQuery newDiv.toggleClass("foo");

// Vanilla newDiv.classList.toggle("foo");

// jQuery $("a").click(function() { // code… })

// Vanilla [].forEach.call(document.querySelectorAll("a"), function(el) { el.addEventListener("click", function() { // code… }); });

// jQuery $("body").append($("

"));

// Vanilla document.body.appendChild(document.createElement("p"));

// jQuery $("img").filter(":first").attr("alt", "My image");

// Vanilla document.querySelector("img").setAttribute("alt", "My image");

// jQuery var parent = $("#about").parent();

// Vanilla var parent = document.getElementById("about").parentNode;

// jQuery var clonedElement = $("#about").clone();

// Vanilla var clonedElement = document.getElementById("about").cloneNode(true);

// jQuery $("#wrap").empty(); var wrap = document.getElementById("wrap");

// Vanilla while(wrap.firstChild) wrap.removeChild(wrap.firstChild);

// jQuery if($("#wrap").is(":empty"))

// Vanilla if(!document.getElementById("wrap").hasChildNodes())

// jQuery var nextElement = $("#wrap").next();

// Vanilla var nextElement = document.getElementById("wrap").nextSibling;

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment