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
jQueryVanilla
```javascript $(document).ready(function() { })``` ```javascript document.addEventListener('DOMContentLoaded', function() { })```
```javascript var divs = $('div')``` ```javascript var divs = document.querySelectorAll('div')```
`var newDiv = $('
')`
`var newDiv = document.createElement('div')`
`newDiv.addClass('foo')` `newDiv.classList.add('foo')`
`newDiv.toggleClass('foo') newDiv.classList.toggle('foo')
`$('a').click(function() { // code… })` `[].forEach.call(document.querySelectorAll('a'), function(el) { el.addEventListener('click', function() { // code… }) })`
`$('body').append($('

'))

document.body.appendChild(document.createElement('p'))
`$('img').filter(':first').attr('alt', 'My image') document.querySelector('img').setAttribute('alt', 'My image')
`var parent = $('#about').parent()` `var parent = document.getElementById('about').parentNode`
`var clonedElement = $('#about').clone()` var clonedElement = document.getElementById('about').cloneNode(true)
`$('#wrap').empty()` `var wrap = document.getElementById('wrap') while(wrap.firstChild) wrap.removeChild(wrap.firstChild)`
`if($('#wrap').is(':empty'))` `if(!document.getElementById('wrap').hasChildNodes())`
`var nextElement = $('#wrap').next()` `var nextElement = document.getElementById('wrap').nextSibling`
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment