Learn JavaScript DOM Traversal In 15 Minutes

script — 21/09/2022 · 44 Comments



IMPORTANT: JavaScript Simplified Course: https://javascriptsimplified.com Traversing the DOM in JavaScript is crucial to building …

44 Comments

  5. <!DOCTYPE html>

    <html lang="en">

    <head>

    <meta charset="UTF-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>Document</title>

    <style>

    body{

    margin: 0;

    }

    div{

    display: flex;

    margin: 0.5rem;

    padding: 1rem;

    border: 3px solid black;

    min-height: 1rem;

    flex-grow:1;

    }

    .grandparent{

    background-color: hsl(0, 50%, 50%);

    flex-direction: column;

    }

    .parent{

    background-color: hsl(100, 50%, 50%);

    }

    .child{

    background-color: hsl(200, 50%, 50%);

    }

    </style>

    </head>

    <body>

    <div class="grandparent" id="grandparent-id">

    <div class="parent">

    <div class="child"></div>

    <div class="child"></div>

    </div>

    <div class="parent">

    <div class="child"></div>

    <div class="child"></div>

    </div>

    </div>

    <script src="script.js"></script>

    </body>

    </html>

  7. I am so glad I am in your discord. Someone just saved my life lol or helped me with this. I also love your CSS Battles. You should do that with JS to see how you both differ in your writing functions, that would be awesome to see.

  8. I only watch your videos about website programming.This only says how good you are at explaining code and most importantly is easy to understand and also to memorize. 🤗

  12. how did you make the preview page live change when ever you save the file it change automatically there? please share the trick

  14. Pretty weird, why does getelementbyid have a foreach method but get elementbyclassname doesn't?!
    (The HTML standard limits the existence of Id to exactly 1 per document, while the number of classes is not limited.)

    I will probably never understand, why they decided to do so. Luckily there is the queryselector/all.

  15. is it possible for future examples, you provide a link to the code you will be working with? so that we can code along with you?

  17. Does anyone have the answer as to why he had to convert the class parents into an Array but a few minutes later he was working with a class and did NOT convert that class into an array?

  19. "All the methods we've talked about so far – getElementById, getElementsByClassName, querySelector and querySelectorAll – work on every single element, not just the document."
    That's not true about getElementById though. That method is exclusive to the document object. The reasoning behind that being the case is probably that since an element's id is globally unique, it's sensible to be only able to select an element by it if you're sure to be looking in the entire document and not to be potentially "lured" into the trap of making multiple attempts for finding an element by a single id, because you're certainly not going to get multiple results.

  21. I am following your front end development road map as the stepping stone for my career bro. Seriously they way u explain is great and i think by following ur tutorial i can be placed in MNC or other web development firm sooner. But few things I can’t understand quickly it doesn’t mean ur teachings are not good it’s just me who is slow at the moment. But i am trying to push my limit to the end to grab the knowledge of how programming works. Thanks man!❣️🙏🏻

  27. I checked the Timestamps and I was like meh I know all of these but I watched the video anyway because you never know what you will find and then you mentiond the closest() function which I never knew existed ! I'm glad I stayed till the end of the video!

  30. Is it typical to build objects in javascript and use them to populate html elements or when would you actually go through the trouble of creating a class to make objects that can affect your website?

  35. He goes really fast. Didn't realize .children was a built in DOM property and was mixing them up with his html .child class

  41. Dude you are amazing.Thanks for making that Frontend/Backend guide, it's so easy to follow and makes my learning process a lot easier. Love you!

  43. It's amazing really. I've been a happy amateur in Javascript for many years. I'm by no means an expert, and you'd be hard-pressed to classify me as good, but still. I know my stuff.
    Every now and then though, something pops up that simply rocks my Javascript world.
    For years I've been mumbling select swearwords for having to build proper loops for looping element collections.
    And then you just go and point out something so ridiculously obvious it annoys me. Just make an effing array of them…

Leave a Reply

© 2023 53GB