Understanding the Document Object Model - 13

Sign in to queue

Description

In this video, we discuss the Document Object Model, explaining how the web browser parses and creates the DOM from HTML5 code, the purpose of the window and document objects, the built-in API functions for accessing parts of the DOM, and more.

Tag:

JavaScript

Embed

Download

Download this episode

The Discussion

  • User profile image
    AdiTao

    Thanks for this video, it explains a lot. 

  • User profile image
    HonraoPrasad

    Bob, another option to window.onload event would be to declare the JS file at the bottom of the HTML page. In that case first DOM will get loaded and then JS. I'm not sure whether its a right approach, but I have seen many HTML pages with JS declared in the bottom half. Can you please clarify on this?

  • User profile image
    Suhail Ahmed

    HonraoPrasad, its good idea to put any other script or style below html, because to increase performance of the page loading, such that when page gets loaded it can then be configured to.

  • User profile image
    BobTabor

    Re-opening this closed thread ...

  • User profile image
    Yumikokk

    Thank you Bob,

    I have a question.

      document.getElementById('clickMe').onclick = runTheExample;

    //why is runTheExample, not runTheExample()?

    When should I put a (), and when I shouldn't put () ?

     

    Thank you!

    Best,

    Yumiko

  • User profile image
    BobTabor

    @Yumikokk: Great question.  The open-close parenthesis ( ) operator tells the JavaScript execution engine to EXECUTE THE FUNCTION NOW.  PULL THE TRIGGER!  However, without the parenthesis, we're merely pointing to a function.  So, in that code, we're saying WHEN someone performs a click on the element called clickMe, THEN pull the trigger.  

    If we put parenthesis on that line:

    document.getElementById('clickMe').onclick = runTheExample();

    ... then we will fire the function right away.  That's not what we want.  We want to fire it off when the clickMe is clicked.

    Does that help? 

  • User profile image
    Sahil

    Hi Watching it in 2017, very interesting. Would you recommend something to practice?

Add Your 2 Cents