JavaScript closest
When it comes to finding relationships between elements, we traditionally think of a top-down approach. We can thank CSS and querySelector
/querySelectorAll
for that relationship in selectors. What if we want to find an element's parent based on selector?
To look up the element tree and find a parent by selector, you can use HTMLElement
's closest
method:
// Our sample element is an "a" tag that matches ul > li > a
const link = document.querySelector('li a');
const list = a.closest('ul');
closest
looks up the ancestor chain to find a matching parent
element -- the opposite of traditional CSS selectors. You can provide closest
a simple or complex selector to look upward for!
![How I Stopped WordPress Comment Spam]()
I love almost every part of being a tech blogger: learning, preaching, bantering, researching. The one part about blogging that I absolutely loathe: dealing with SPAM comments. For the past two years, my blog has registered 8,000+ SPAM comments per day. PER DAY. Bloating my database...
![I’m an Impostor]()
This is the hardest thing I've ever had to write, much less admit to myself. I've written resignation letters from jobs I've loved, I've ended relationships, I've failed at a host of tasks, and let myself down in my life. All of those feelings were very...
![Resize an Image Using Canvas, Drag and Drop and the File API]()
Recently I was asked to create a user interface that allows someone to upload an image
to a server (among other things) so that it could be used in the various web sites my
company provides to its clients. Normally this would be an easy task—create a...
![Animated AJAX Record Deletion Using MooTools]()
I'm a huge fan of WordPress' method of individual article deletion. You click the delete link, the menu item animates red, and the item disappears. Here's how to achieve that functionality with MooTools JavaScript.
The PHP - Content & Header
The following snippet goes at the...