Skip to content

Instantly share code, notes, and snippets.

@michalbcz
Last active January 14, 2021 05:37
Show Gist options
  • Save michalbcz/da426331678d6c700d20c34a76489bee to your computer and use it in GitHub Desktop.
Save michalbcz/da426331678d6c700d20c34a76489bee to your computer and use it in GitHub Desktop.
vanilla js (not working in IE10 and older mostly)
// JSON
const data = await (await fetch('/my-url')).json();
// Post
await fetch('/my-url', { method: 'POST', body: data });
// Request
try {
const resp = await fetch('/my-url');
// ...
} catch (e) {
// ...
}
// Fade In
el.animate({ opacity: 1 }, 400);
// Fade Out
el.animate({ opacity: 0 }, 400);
// Hide
el.hidden = true;
// Show
el.hidden = false;
// After
target.after(el);
// Append
target.append(el);
// Before
target.before(el);
// Each
for (const el of document.querySelectorAll(selector)) {
// ...
}
// Empty
el.replaceChildren(); // or el.textContent = '', depending on which you find clearer
// Filter
[...document.querySelectorAll(selector)].filter(filterFn);
// Get Height
el.clientHeight;
// Get Width
el.clientWidth;
// Matches
el.matches('.my-class');
// Remove
el.remove();
// Delegate
document.addEventListener(eventName, e => {
const match = e.target.closest(elementSelector);
if (match) {
handler.call(match, e);
}
});
// Trigger Custom
el.dispatchEvent(new CustomEvent('my-event', { detail: { some: 'data' } }));
// Trigger Native
el.dispatchEvent(new Event('change'));
// Extend
Object.assign({}, objA, objB);
// Parse HTML
(new DOMParser()).parseFromString(htmlString);
// Type
obj[Symbol.toStringTag];
@michalbcz
Copy link
Author

as seen at https://news.ycombinator.com/item?id=25770858 (comments for You might not need jQuery (2014) (youmightnotneedjquery.com))

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