SHARE

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 ==========

https://www.youtube.com/playlist?list=PL4cUxeGkcC9i9Ae2D9Ee1RvylH38dKuET

========== CSS for Beginners Playlist ==========

https://www.youtube.com/playlist?list=PL4cUxeGkcC9gQeDH6xYhmO-db2mhoTSrT

========== HTML for Beginners Playlist ==========

https://www.youtube.com/playlist?list=PL4cUxeGkcC9ibZ2TSBaGGNrgh4ZgYE6Cc

========== 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

17 COMMENTS

  1. huge thanks for great tuts but i have a question : why your page is built mainly on divs instead of html5 tags (header,main,aside,footer)??

  2. Hello! Thanks for video. How do I select <img> from this one : <div id="dw4" class="bcw" >
    <ul id="imageUl">
    <li><img id="p1" src="img_in/11.jpg" class="img-responsive" alt=""></li>
    <li><img src="img_in/22.jpg" class="img-responsive" alt=""></li>
    <li><img src="img_in/33.jpg" class="img-responsive" alt=""></li>
    <li><img src="img_in/44.jpg" class="img-responsive" alt=""></li>
    <li><img src="img_in/55.jpeg" class="img-responsive" alt=""></li>
    <li><img src="img_in/66.jpeg" class="img-responsive" alt=""></li>
    <li><img src="img_in/44.jpg" class="img-responsive" alt=""></li>
    <li><img src="img_in/55.jpeg" class="img-responsive" alt=""></li>
    <li><img src="img_in/66.jpeg" class="img-responsive" alt=""></li>
    </ul></div>

  3. There's something kind of subtle that I can't get my head around. You know when you were assigning arrays to variables? What were they arrays of? They weren't arrays of numbers right and they weren't arrays of strings… they were arrays of?

    And further more, what I'm not getting is how does changing that variable actually even affect the DOM shouldn't it just affect the variables, which are simply references to nodes in the DOM?

    P.s. twas nice to here from an accent local to me. I think, either way : thanks from Leeds,Yorkshire.

LEAVE A REPLY

Please enter your comment!
Please enter your name here