Brief Introduction
HTML provides the structure for a site. CSS provides the styling. JavaScript (and the DOM) provides the interactivity for a site. Without JavaScript and the DOM, a site is static. The web is alive and shouldn't be shackled by a non-interactive page! Are you interested in learning how to programmatically add new content to a page? Do you want to dynamically change the styling of an element, respond to a form submission by displaying a message to the user, or learn how to measure the performance oCourse Summary
Learn how to manipulate the Document Object Model (DOM) using JavaScript to create dynamic web pages and improve user experience.Key Learning Points
- Understand how the DOM works and how to manipulate it using JavaScript
- Learn about event handling and how to create interactive web pages
- Explore the Document Object Model (DOM) and how it relates to HTML and CSS
Related Topics for further study
Learning Outcomes
- Understand the basics of the DOM and how it can be manipulated using JavaScript
- Create interactive web pages with event handling
- Improve user experience by dynamically updating content on web pages
Prerequisites or good to have knowledge before taking this course
- Basic knowledge of HTML and CSS
- Familiarity with JavaScript syntax
Course Difficulty Level
IntermediateCourse Format
- Online self-paced
- Project-based
Similar Courses
- JavaScript Essential Training
- JavaScript: The Good Parts
- JavaScript and jQuery
Related Education Paths
Notable People in This Field
- Wes Bos
- Lea Verou
Related Books
Requirements
- Students should have experience with the following skills: building a website with HTML styling page elements with CSS specifically, selecting elements by ID, class, or tag using the JavaScript data types (e.g. strings, arrays, object, functions, etc.) looping through data (e.g. the for loop) These skills are covered in the following courses: HTML and CSS Syntax Intro to JavaScript See the technology requirements for using Udacity. See the Technology Requirements for using Udacity.
Knowledge
- Instructor videosLearn by doing exercisesTaught by industry professionals
Outline
- lesson 1 The Document Object Model Learn how the DOM is constructed Use DOM methods to select page elements Figure out where an Element's properties come from lesson 2 Creating Content with JavaScript Use DOM and JavaScript to add new content to the page Learn DOM and JavaScript to remove page content Use DOM and JavaScript to style page elements lesson 3 Working with Browser Events Discover the hidden world of browser events Use DOM and JavaScript to respond to specific events Learn when the web page is ready to be modified and controlled lesson 4 Performance Learn how to measure the speed of your DOM and JavaScript code Identify code that causes Reflow and Repaint issues Explain how the JavaScript Event Loop works
Summary of User Reviews
This course on JavaScript and the DOM received positive reviews from many users. They found it to be informative and engaging, with practical exercises and clear explanations. One key aspect that many users appreciated was the instructor's ability to simplify complex concepts.Pros from User Reviews
- Informative and engaging
- Practical exercises
- Clear explanations
- Instructor simplifies complex concepts
Cons from User Reviews
- Some users found the pace too slow
- Not enough advanced topics covered
- Course material could be more organized
Web Accessibility
- 0.0
-
![]()
![]()
![]()
![]()
![]()
Not every user approaches their applications with the same abilities. Whether it’s age, vision concerns, limited hearing, a broken arm, or other limitations, everybody deserves access to their apps....
React Native Design - Build front end of 10 mobile Apps
- 3.6
-
![]()
![]()
![]()
![]()
![]()
Build front end of 10 Apps for Android and iOS using React Native. Expo, Native Base, Elements - All covered ...
Software development in Python: A practical approach
- 3.8
-
![]()
![]()
![]()
![]()
![]()
Build with the new Qml 3 | Learn how to build a python bundled app (. exe, . dmg, . sh, etc) and a wheel (....
Front-End Web Development with React
- 4.7
-
![]()
![]()
![]()
![]()
![]()
This course explores Javascript based front-end application development, and in particular the React library (Currently Ver. 16. 3). This course will use JavaScript ES6 for developing React application....
