JavaScript DOM - Interactive and Dynamic Web Pages
Ends soon! Keep adding new skills with 10,000+ programs for $239 (usually $399). Save now.
JavaScript DOM - Interactive and Dynamic Web Pages
Included with
Recommended experience
Recommended experience
What you'll learn
Identify and recall the basic structure and elements of the DOM
Explain how JavaScript can be used to manipulate DOM elements and attributes.
Demonstrate the ability to dynamically update content on a webpage using JavaScript.
Break down complex web interactions into manageable JavaScript functions and DOM manipulations.
Skills you'll gain
Details to know
See how employees at top companies are mastering in-demand skills
There are 3 modules in this course
Updated in May 2025.
In this comprehensive course, you will embark on a journey to master JavaScript and its powerful DOM manipulation capabilities. Starting with the fundamentals, you'll understand how JavaScript integrates with HTML to create interactive webpage content. Through a series of progressively challenging modules, you will learn how to manipulate DOM elements, respond to user inputs, and dynamically update web pages without the need to refresh the browser. As you advance, the course delves deeper into the practical applications of JavaScript DOM. You'll explore various techniques to interact with webpage elements, manage events, and implement animations. Each section is designed to build on the previous one, ensuring a cohesive learning experience that reinforces your understanding through hands-on examples and projects. By the end of this course, you will have the confidence and skills to create fully interactive and dynamic web projects. You'll be able to apply what you've learned to real-world scenarios, making your web pages more engaging and user-friendly. This course is perfect for anyone looking to advance their web development skills and make their websites stand out. This course is designed for aspiring web developers and designers who have a basic understanding of HTML and CSS. No prior JavaScript knowledge is required, although familiarity with basic programming concepts will be beneficial.
In this module, we will introduce the fundamentals of JavaScript and its role in creating interactive webpage content. You will learn how to get started with coding in JavaScript, including variables, arrays, objects, and functions, as well as how to manipulate the Document Object Model (DOM) to enhance web page interactivity.
What's included
27 videos
27 videos•Total 286 minutes
- Introduction•1 minute
- How to Create Dynamic Interactive Webpages with JavaScript•3 minutes
- Getting Started on How to Start Coding with JavaScript•6 minutes
- How to Code with JavaScript Adding JavaScript•9 minutes
- JavaScript Code Tips and Learn How to Start with JavaScript•10 minutes
- How to Use Variables in JavaScript•13 minutes
- What Is JavaScript Dynamic Type Conversion and How It Works•9 minutes
- Variable Naming Rules on How to Declare JavaScript Variables•4 minutes
- Arrays and Objects in JavaScript Coding Examples•9 minutes
- JavaScript Functions – How Functions Can Be Used in Code•13 minutes
- JavaScript Document Object Model for Interactive Webpages•11 minutes
- DOM Methods with JavaScript Select HTML Pages Elements•10 minutes
- Logic Conditions with JavaScript if Statement Switch•18 minutes
- Operators in JavaScript – How to Apply Operators•15 minutes
- Ternary Operator JavaScript Short One Statement Conditions•8 minutes
- Math Random Values JavaScript – Get Random Numbers•16 minutes
- JavaScript for While and Do While Loops – Run Blocks of Code•8 minutes
- JavaScript Objects – How to Use Objects in Code•16 minutes
- Object Construction with JavaScript Coding•5 minutes
- Common JavaScript Array Methods to Update Array Values•17 minutes
- Looping Through Array Contents forEach Methods and For Loops for Array Data•12 minutes
- Array Methods for Items Contained in the Array JavaScript Coding•13 minutes
- Array Methods for Sorting Array Items Using JavaScript Random Array•9 minutes
- JavaScript Array Method Examples to Find Array Items•12 minutes
- JavaScript String Methods Common Functionality•14 minutes
- Interactive Word Scramble Game with JavaScript Shuffle Letters in Strings•14 minutes
- LocalStorage with JavaScript JSON Parse and Stringify of Objects•12 minutes
In this module, we will delve into the interaction between JavaScript and the DOM, focusing on how to create and manipulate HTML elements dynamically. You will learn to add event listeners, manage form inputs, and respond to mouse and keyboard events, making your web pages more interactive.
What's included
8 videos
8 videos•Total 145 minutes
- Introduction to JavaScript and the DOM•2 minutes
- Introduction to JavaScript and the DOM How to Create Interactive Webpages•16 minutes
- Creating and Deleting Elements with JavaScript Code•20 minutes
- Lists Move Elements from Parent to Other Element Items Another List JavaScript•20 minutes
- AddEventListeners and DOM Loading Events in JavaScript•19 minutes
- Form Select and Input Fields Values and Creation of Elements JavaScript Example•27 minutes
- DOM Mouse and Keyboard Events Page Event Listeners Create Interactions•22 minutes
- JavaScript RequestAnimationFrame Smooth Animations within the DOM Ball Bouncing•20 minutes
In this module, we will work on hands-on projects that utilize JavaScript and the DOM to create interactive and dynamic web pages. You will build various applications, such as games and dynamic content displays, to solidify your understanding and application of JavaScript in practical scenarios.
What's included
11 videos2 assignments
11 videos•Total 309 minutes
- Introduction to Coding Projects Using JavaScript DOM Dynamic Webpages•5 minutes
- Background Color Table Fun Create Table with JavaScript•28 minutes
- Element Selector and Swap of Elements within the DOM JavaScript Code•11 minutes
- JavaScript Dynamic Modal from Data Object Create Modals with Code•30 minutes
- Page Clickers Create Dynamic Interactive Click Counters•23 minutes
- Random Words Maker with JavaScript String Methods•20 minutes
- Scrollbar Scroll Tracker Calculate the Scroll Position on the Page•22 minutes
- Math Quiz and Start and Stop Counters with JavaScript•32 minutes
- Dynamic Interactive JavaScript DOM Memory Game CSS Grid and Game Logic•40 minutes
- Dynamic JavaScript Coin Flipping Game DOM Game Coding Challenge•43 minutes
- JavaScript Battle Cards Game Using Array Methods•56 minutes
2 assignments•Total 75 minutes
- Full Course Practice Assessment•15 minutes
- Full Course Assessment•60 minutes
Instructor
Explore more from Mobile and Web Development
- Status: Free Trial
Course
- Status: Free Trial
- Status: Free TrialU
University of Michigan
Course
- Status: Free Trial
Why people choose Coursera for their career
Frequently asked questions
Yes, you can preview the first video and view the syllabus before you enroll. You must purchase the course to access content not included in the preview.
If you decide to enroll in the course before the session start date, you will have access to all of the lecture videos and readings for the course. You’ll be able to submit assignments once the session starts.
Once you enroll and your session begins, you will have access to all videos and other resources, including reading items and the course discussion forum. You’ll be able to view and submit practice assessments, and complete required graded assignments to earn a grade and a Course Certificate.
More questions
Financial aid available,