Skip to main content Accessibility Feedback

Buoy: A tiny collection of helper methods for getting things done in native JavaScript

A few years ago, I stopped using jQuery and started writing exclusively in native JavaScript (aka vanilla JS).

There’s a handful of helper methods I end up using in every script I write, so I decided to bundle them into a helper library called Buoy.

Why? #

I end up reusing the same methods over and over again in my JS plugins. If I’m using more than one of them on a projects, this let’s me keep my code more DRY and reduces my overall file size.

It also makes native JavaScript development more accessible for people coming from a jQuery background.

What’s included? #

  • buoy.forEachTodd Motto’s method for looping through arrays,
    nodelists, and objects.
  • buoy.extend – Merge two or more objects.
  • buoy.getHeight – For reliably getting the height of an element.
  • buoy.getOffsetTop – Get an element’s distance from the top of the Document.
  • buoy.getClosest – Get the closest matching element up the DOM tree. Match by class, ID, data attribute, or tag.
  • buoy.getParents – Get an element’s parent nodes. Optionally filter by class, ID, data attribute, or tag.
  • buoy.getSiblings – Get an element’s sibling nodes.
  • buoy.getQueryString – Get data from a URL’s query string.

How do I get it? #

Download Buoy on GitHub.

🔥 Level-up your JavaScript skills! All of the Vanilla JS Pocket Guides have been updated for ES6 with new methods, techniques, and browser APIs. Learn more →

Have any questions or comments about this post? Email me at or contact me on Twitter at @ChrisFerdinandi.

Get Daily Developer Tips