JavaScript: Working with the DOM & Events

ECMAscript 2019    |    Intermediate
  • 13 videos | 1h 20m 55s
  • Includes Assessment
  • Earns a Badge
Likes 103 Likes 103
Explore different features available in Javascript to manipulate elements of a web page by using its Document Object Model (DOM) structure and how Javascript interacts with a browser by using the Browser Object Model (BOM). In this 13-video course, key concepts covered include how to use the document object to retrieve individual elements of a web page and access their values and properties; how to alter web page contents by modifying a DOM; and how to retrieve children of elements of a web page as an array. Begin by observing how to write a function to generate an animation; how to define event listeners and handlers for clicks on web page buttons; and how to create handlers for events of users by clicking on buttons. Next, learners observe how to use handlers for mouse events on web page elements; how to use the screen, window, and navigator objects of BOM to get information about the end-user's environment; and how to use the window object to interact with the end-user's browser.

WHAT YOU WILL LEARN

  • discover the key concepts covered in this course
    use the document object to retrieve individual elements of your web page and access their values and properties
    alter the contents of a web page by modifying its DOM
    retrieve the children of elements of your web page as an array
    insert new elements into your web page by adding nodes to the DOM structure
    delete or replace existing nodes in the DOM of your web page
    write a function to generate an animation by periodically updating the DOM of your web page
  • define event listeners and handlers for clicks on a web page button
    create handlers for the events of users clicking on a button and for modifying the contents of a text box
    define handlers for mouse events on elements of your web page
    use the screen, window, and navigator objects of the BOM to get information about the end user's environment
    use the window object to interact with the end user's browser
    summarize the key concepts covered in this course

IN THIS COURSE

  • 2m 10s
  • 9m 33s
    In this video, learn how to use the document object to retrieve individual elements of your web page and access their values and properties. FREE ACCESS
  • Locked
    3.  Modifying the DOM of a Web Page
    3m 49s
    In this video, learn how to change the contents of a web page by modifying its DOM. FREE ACCESS
  • Locked
    4.  Accessing the Child Nodes of a DOM Element
    8m 46s
    In this video, you will retrieve the children of elements of your web page as an array. FREE ACCESS
  • Locked
    5.  Adding Nodes to the DOM
    8m 33s
    Learn how to insert new elements into your web page by adding nodes to the DOM structure. FREE ACCESS
  • Locked
    6.  Removing and Replacing Nodes in the DOM
    3m 47s
    Learn how to delete or replace existing nodes in the DOM of your web page. FREE ACCESS
  • Locked
    7.  Generating an Animation with JavaScript
    6m 50s
    Find out how to write a function to generate an animation by periodically updating the DOM of your web page. FREE ACCESS
  • Locked
    8.  An Introduction to Event Handling
    8m 9s
    In this video, you will learn how to define event listeners and handlers for clicks on a web page button. FREE ACCESS
  • Locked
    9.  Event Handlers for Clicks and Input
    7m 56s
    In this video, learn how to create handlers for the events of users clicking on a button and for modifying the contents of a text box. FREE ACCESS
  • Locked
    10.  Event Handlers for Mouse Events
    5m 50s
    Learn how to define handlers for mouse events on elements of your web page. FREE ACCESS
  • Locked
    11.  The Browser Object Model (BOM)
    8m 1s
    In this video, you will use the screen, window, and navigator objects of the BOM to get information about the end user's environment. FREE ACCESS
  • Locked
    12.  The window Object
    6m 20s
    Learn how to use the window object to interact with the user's browser. FREE ACCESS
  • Locked
    13.  Course Summary
    1m 11s
    In this video, we will summarize the key concepts covered in this course. FREE ACCESS

EARN A DIGITAL BADGE WHEN YOU COMPLETE THIS COURSE

Skillsoft is providing you the opportunity to earn a digital badge upon successful completion on some of our courses, which can be shared on any social network or business platform.

Digital badges are yours to keep, forever.

YOU MIGHT ALSO LIKE

Course JavaScript: Advanced Function Operations
Likes 56 Likes 56  
Course Web Fundamentals: Web Development with HTML
Course JavaScript: Introduction
Likes 753 Likes 753  

PEOPLE WHO VIEWED THIS ALSO VIEWED THESE

Course JavaScript: Objects
Likes 359 Likes 359  
Course JavaScript: Closures & Prototypes
Likes 32 Likes 32  
Course Web Fundamentals: Dynamic Web Pages with JavaScript