Hey gang, in this JavaScript DOM tutorial, I’ll show youhow we can query the DOM for elements with a certain class name, or tag name. The methods we’ll use are:
– getElementsByTagName()
– getElementsByClassName()
—– COURSE LINKS:
+ Atom editor – https://atom.io/a
+ GitHub Repo – https://github.com/iamshaunjp/JavaScript-DOM-Tutorial
———————————————————————————————
Other tutorials:
—– JAVASCRIPT FOR BEGINNERS:
—– CSS FOR BEGINNERS:
—– NODE.JS TUTORIALS
—– SUBSCRIBE TO CHANNEL – https://www.youtube.com/channel/UCW5YeuERMmlnqo4oq8vwUpg?sub_confirmation=1
============== 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
20 responses to “JavaScript DOM Tutorial #3 – Get Elements By Class or Tag”
i copied this code but i get nothing in my console?
Great Video, Thank you
please, What is the name of the theme you are using at Atom?
Now there's an even easier way to turn non-arrays into arrays with the spread operator, like so: var myArray = […nonArray];
Finally – a tutorial on DOM that makes sense. Where can we access the repo? Is it still available?
You're my one of fav youtuber !! Keep it up bro
Please, can you tell me the font name, you are using the atom editor? Please………. !
what package do you use for autocomplete in atom??
Nicee man. Very nice.
why do i need to change it to array first
using class=title for headers next to a list of book titles. aye.
This Ninja rocks
Thanks you dear :"")
Merci
Really good video, I'm enjoying this series. There are a couple of 'gotchas' I'd like to point out however.
First off, when writing a for loop, always declare your iterator variable ('i' or whatever) with the var keyword (or let if you're using JS6) so it looks like (var i = 0; i < whatever; i++). If you don't do this the iterator variable will be in the global scope and that can cause unexpected, really hard to chase down bugs. I speak from experience with this one.
Second, Array.from() is indeed awesome, but it's also very new. Granted, it has good browser support but it's a JS6 method and if you need to support older browsers either don't use it or employ a pollyfill.
Great video! Thank you
We can use for (title of titles) {…} . The for loop from ES6 loops through HTML collection. I think.
Array.from(), it's awesome! Thanks man!
Not gonna lie, since it's removal, i scream in my head the WOAAHH! after the intro music, everytime
An alternative way to iterate array-like objects is to use ES6's for..of, which is pretty nice: for (const el of document.getElementsByTagName('p')) { …. }
thanks man !!