Hey guys! In my last post, I shared why I made NanoScript for Vlox. I wanted to avoid heavy frameworks but also skip the long code of vanilla JavaScript. Back then, I mentioned that some features were still missing. Today, I am happy to tell you that the DOM traversal methods are finished and ready to use!
You no longer have to write complex vanilla code to move around your HTML elements.
What's New?
I wanted moving between parents, siblings, and children to feel very simple. Here are the new tools I added to NanoScript:
-
.parent()- Finds the immediate parent element. -
.children()- Gets all the direct child elements. -
.next()- Finds the next sibling element. -
.prev()- Finds the previous sibling element. -
.closest(selector)- Looks up the tree to find the nearest parent matching a specific name.
Just like the rest of NanoScript, these new methods don't take up much memory. And now, here is a quick example of how it makes your code look cleaner when you click a button to hide a card:
NS(".delete-btn").on("click", function () {
NS(this).closest(".card").css("display", "none");
});
What's Next?
Now that traversal tools are done, I will start working on the fetch wrapper. This will help you make API network calls easily without loading external libraries like Axios. I'm also working on the official documentation, which will be ready very soon.
Try It Out!
Please try NanoScript for your next small project and let me know what you think!
You can see the source code and star the project here: https://github.com/Hfs2024/NanoScript
Leave a comment below and tell me what features you want me to build next!
Top comments (0)