Hey all, in this JavaScript tutorial for beginners, I’ll explain how we can reach into the DOM and grab content (nodes) from the DOM tree, such as elements, classes and ID’s. And I’ll also explain how we can search ‘within’ tags under different scopes to find child elements.
In this tutorial we’ll learn three JavaScript methods (functions) to do that:
getElementsByTagName() – returns an array of objects
getElementsByClassName() – returns an array of objects
getElementById() – returns a single object
SUBSCRIBE TO CHANNEL – https://www.youtube.com/channel/UCW5YeuERMmlnqo4oq8vwUpg?sub_confirmation=1
========== JavaScript for Beginners Playlist ==========
========== CSS for Beginners Playlist ==========
========== HTML for Beginners Playlist ==========
========== The Net Ninja ============
For more front-end development tutorials & to black-belt your coding skills, head over to – https://www.youtube.com/channel/UCW5YeuERMmlnqo4oq8vwUpg or http://thenetninja.co.uk
========== Social Links ==========
Twitter – @TheNetNinja – https://twitter.com/thenetninjauk
Original source
28 responses to “JavaScript Tutorial For Beginners #33 – Traversing the DOM”
I have a midterm on this tomorrow – thank you for your help, my guy!
9/28/19 3:13pm PST the HTML on your …https://www.thenetninja.co.uk.….website is different than on your tutorial. Cant follow the lesson by syntax ( this is important when learning ) but can just watch it. Ok, I know you have many tutorials and its probably nearly impossible to keep it all updated, but just letting you know.
Wow this video helped me a lot ! keep it up dude.
my data did not show in array form why ?
Very good explanation. Very clear and cover the points.
Can anyone help? I'm stuck n this video
I get an error, this is my code:
var myContentDivs = document.getElementsByClassName("content");
// this returns html collection
var myH2 = myContentDivs[1].getElementsByTagName("h2");
// Returns an Error:
VM1014:1 Uncaught TypeError: Cannot read property 'getElementsByTagName' of undefined
at <anonymous>:1:29
Where can we download your examples?
That was a tutorial on selecting DOM elements, not on traversing!
Thanks
Crystal clear. Very helpful.
u've actually made javascript fun to learn…..CHEERS
thanks a lot! Was very helpful! I 've just started to practice JS DOM. Like that a lot.
you could have done myContentDivs[1].firstElementChild for the <h2> tag right?
wow
This really needs more than 500 likes, I actually understood how the D.O.M works thanks to your channel
any idea, why my console always returns HTMLCollection, and then i always have to use dropdown button to see what text "h2" actually has by checking innerHTML. ?
Amazing, you level down me stress, thumbs up…. now subscribed 🙂
Thanks for making me feel like I'm building my ninja coding skills :).
thanks
One of the most easiest way to learn Javascript
Your explanations are so simple and understanding . Thanks 😉
you rock, dude! the best!
i believe it returned a node list, not an array
MGTOW
Great explanation
cool, thanks
The web page has changed! Can not follow now… never mind.
great videos . thank you so much