JavaScript Snippets
Last site update: 1 Sep 2025
The VS Code snippets for JavaScript are less obvious than the CSS or HTML emmet ones but they can save a lot of typing. And unlike AI assistants they’re faster and predictable (once you know them.)
So here’s a partial list of some of the most useful .. first published on YAMLsite.
| snippet | what it does | code produced |
|---|---|---|
| al | alert() | alert(‘msg’); |
| co | confirm() | confirm(‘msg’); |
| pm | prompt() | prompt(‘msg’); |
| ae | addEventListener | document.addEventListener(’load’, function (e) { // body }); |
| clg | console.log | console.log() |
| gi | getElementById | document.getElementById(‘id’); |
| qs | querySelector | document.querySelector(‘selector’); |
| qsa | querySelectorAll | document.querySelectorAll(‘selector’); |
| fn | function | function methodName (arguments) { // body } |
| afn | anonymous function | function(arguments) { // body } |
| anfn | arrow function | (params) => { } |
| nfn | named function | const name = (params) => { } |
| fre | forEach() loop | array.forEach(currentItem => { }); |
| sto | setTimeout | setTimeout(() => { }, delayInms); |
| sti | setInterval | setInterval(() => { }, intervalInms); |
| ca | classList.add() | document.classList.add(‘class’); |
| ct | classList.toggle() | document.classList.toggle(‘class’); |
| cr | classList.remove() | document.classList.remove(‘class’); |
| sa | setAttribute() | document.setAttribute(‘attr’, value); |
| ra | removeAttribute() | document.removeAttribute(‘attr’); |
| ga | getAttribute() | document.getAttribute(‘attr’); |
| cel | createElement() | document.createElement(elem); |
| jp | JSON.parse | JSON.parse(obj); |
| js | JSON.stringify | JSON.stringify(obj); |
See the full list