DEV Community

JavaScript DOM - Part 6 - Get Elements By TagName [video + article]

Tharun Shiv on May 22, 2020

This is going to be a multi-part Video + article tutorial series on JavaScript DOM. You're reading Part 6 You can read Part 5 here: ...

Read full post

Jaya chandrika reddy • May 23 '20

Looking forward for the Query Selectors 😊 Subscribed to the YouTube Channel 👍

praveenreddy1798 • May 23 '20

yep same here

Tharun Shiv • May 23 '20

Thank you

venkat anirudh • May 23 '20

yeah

Tharun Shiv • May 23 '20

Thank you Venkat

Tharun Shiv • May 23 '20

Thanks!

Tom Anderson • May 22 '20

Nice article! Just thought I'd add to the iteration bit:

Any DOM selector that returns mutlple objects (getElementsByTagName, getElementsByClassName ect) return a HTMLCollection object, which is different from an array, lacking all of the useful prototype functions like forEach which would make iteration easier and cleaner as opposed to a for loop.
To get around this, I like to use the ES6 spread operator on the result of the DOM function, effectively 'converting' it into a normal JS array, allowing me to operate and iterate over it as usual! See below for an example!

let para = [...document getElementsByTagName("p")];
para.forEach(p => {
    ... 
});

Tharun Shiv • May 23 '20

That's a beauty! Thanks for contributing 🙂

praveenreddy1798 • May 23 '20

Good article. Subscribed to the YouTube Channel

Tharun Shiv • May 23 '20

Glad it helped 😊

venkat anirudh • May 23 '20

good one

Tharun Shiv • May 23 '20

Thank you

jreckers • May 23 '20

I have so been looking for information on these topics, as a newbie, I like the how’s and why’s of the DOM construct! Looking forward to more!

Tharun Shiv • May 23 '20

Yep that's very exciting! Glad to help 🙂 If you would like video content on these , you can check them out on the YouTube channel : youtube.com/c/developerTharun