CPD-accredited courses from £39 · Instant e-certificates · 2,700+ courses
CPD-accredited certificates 020 4618 6402 Team training
Home / Courses / IT and Software / Learn DOM Manipulation with JavaScript
CPD course All Levels

Learn DOM Manipulation with JavaScript

4 enrolled 7h 24m of learning Updated Nov 2026
CertificateOn completion
7h 24mSelf-paced
80 lessonsOn the UISC learning portal
All LevelsNo prior training needed

Course curriculum

1 modules 80 lessons 7h 24m total
01 Learn DOM Manipulation with JavaScript 80 lessons
  1. What is the DOM?
  2. Your first DOM update
  3. Course Project: Code DOM Adventure
  4. HTML and the DOM
  5. DOM standards
  6. The BOM
  7. The CSSOM
  8. The tree (Data structure)
  9. The DOM tree
  10. The DOM and JavaScript
  11. App architecture
  12. Challenge solution: The exit screen
  13. App skeleton
  14. The splash screen file
  15. Download our asset kit now!
  16. Including the assets
  17. Wiring the splash screen element
  18. Creating elements at runtime
  19. Appending HTML strings width append()
  20. Appending nodes with append or append Child
  21. Script order matters
  22. Specifying classes to elements
  23. Working with static styles
  24. Defining styles at runtime
  25. Querying the DOM to find elements
  26. The pixel pipeline
  27. Identifying bad practices
  28. Profiling runtime performance
  29. Batching DOM updates with document fragments
  30. Too many nodes
  31. Removing nodes from the DOM
  32. The animation frames
  33. Our animate method
  34. Our working animation!
  35. Stopping the animation
  36. Let’s build the level!
  37. 2. Our state model to control the DOM from state.
  38. Normalizing attributes
  39. Our level class
  40. Arrays, references and non-iterable empty slots
  41. Building our state with an ugly oneliner
  42. Write code for humans and normalize your code
  43. Rendering the level element
  44. Things are getting messy
  45. Easy bundling
  46. Bundle with the start script
  47. Our dev server
  48. Let’s use DOMContentLoaded and ES Modules (ESM)
  49. Dynamic style elements with CSS as ESM imports
  50. Designing the shape of our state
  51. Initializing our state in preparation to render DOM elements
  52. DOM updates from state
  53. Updates to state are reflected in the DOM
  54. Modeling and render our chip walls
  55. The player – Tech approach
  56. Rendering the player with the DOM
  57. Box model and global styles
  58. Manipulating inline styles with the DOM
  59. Moving the player by changing its state
  60. DOM keyboard event listeners
  61. Mapping and filtering DOM events data
  62. Can the player move? – Tech approach
  63. Preventing overlapping DOM elements
  64. Prepare interactive frames
  65. Resetting className and adding interactive frames on DOM events
  66. Update frames without moving the element on DOM events
  67. Adding random DOM elements
  68. DOM events when pressing the space key
  69. Creating elements on DOM events
  70. z-index manifest
  71. Dynamic element IDs with the DOM
  72. Interacting with other elements using the state model
  73. Remove surrounding walls
  74. Adding the portal to the screen
  75. Random elements on the screen
  76. Grouping inline CSS DOM updates
  77. Exiting the game, when two elements cross paths
  78. Challenge, your turn to build the exit screen
  79. Challenge solution, my turn to build the exit screen
  80. Hiding the portal behind a wall

About this course

Overview:

Welcome to "Learn DOM Manipulation with JavaScript"! This course is your comprehensive guide to mastering Document Object Model (DOM) manipulation using JavaScript. The DOM serves as the interface between JavaScript and HTML, allowing developers to dynamically interact with web pages. In this course, you'll delve into DOM manipulation techniques, learning how to create, access, modify, and delete HTML elements and attributes using JavaScript. By the end, you'll be equipped with the skills to build dynamic and interactive web applications with ease.

  • Interactive video lectures by industry experts
  • Instant e-certificate
  • Fully online, interactive course with Professional voice-over
  • Developed by qualified first aid professionals
  • Self paced learning and laptop, tablet, smartphone friendly
  • 24/7 Learning Assistance
  • Discounts on bulk purchases

Main Course Features:

  • Thorough coverage of DOM manipulation concepts and techniques
  • Hands-on coding projects and exercises for practical learning
  • Exploration of DOM traversal methods to navigate and manipulate the DOM tree
  • Implementation of event handling to respond to user interactions
  • Guidance on dynamically updating web content and styles using JavaScript
  • Best practices for optimizing DOM manipulation code for performance
  • Real-world examples and case studies to illustrate DOM manipulation in action
  • Access to a supportive online community for collaboration and assistance

Who Should Take This Course:

  • Web developers looking to enhance their JavaScript skills with DOM manipulation techniques
  • Students and professionals seeking to understand how JavaScript interacts with web pages
  • Anyone interested in building dynamic and interactive web applications

Learning Outcomes:

  • Master DOM manipulation techniques for creating, accessing, and modifying HTML elements and attributes
  • Navigate and manipulate the DOM tree using DOM traversal methods
  • Implement event handling to respond to user interactions and enhance interactivity
  • Dynamically update web content and styles using JavaScript
  • Optimize DOM manipulation code for improved performance and efficiency
  • Debug and troubleshoot DOM manipulation code effectively
  • Build a portfolio of projects showcasing your proficiency in DOM manipulation
  • Stay updated with the latest trends and techniques in web development with JavaScript and DOM manipulation.

Certification

Once you’ve successfully completed your course, you will immediately be sent a digital certificate. All of our courses are fully accredited, providing you with up-to-date skills and knowledge and helping you to become more competent and effective in your chosen field. Our certifications have no expiry dates, although we do recommend that you renew them every 12 months.

Assessment

At the end of the Course, there will be an online assessment, which you will need to pass to complete the course. Answers are marked instantly and automatically, allowing you to know straight away whether you have passed. If you haven’t, there’s no limit on the number of times you can take the final exam. All this is included in the one-time fee you paid for the course itself.

Your certificate

CPD certificate — download it when you finish

Issued the moment you complete the final module. Every certificate lists the course aims and objectives, anticipated learning outcomes, the quality-assurance process — the elements required for verifiable CPD. Non-registrants can use it as CQC training evidence and for appraisals.

Aims & objectives Learning outcomes Unique certificate number

Common questions

Where do I take the course?

On the UISC learning portal. "Enrol now" takes you to this course there, where you pay securely, get your login and study at your own pace. Your certificate is issued there when you finish.

When can I start?

Immediately. Access opens the moment your order is confirmed and you can learn from any device, in any order, as many times as you like.

How is the course assessed?

A short multiple-choice or scenario-based assessment at the end of the course with instant results. You can retake it as many times as you need at no extra cost.

Can I enrol my whole team?

Yes. Organisations can buy multiple places on one invoice and receive a training record for every learner. Contact us for team pricing.

Keep learning

Related courses

More in IT and Software
Stock Trading
Save 86%
10 lessons
IT and Software 4h 2m

Stock Trading

16 others bought this course in the last 24 hours! Stock Trading teaches you everything on the topic thoroughly from scratch so you can achieve a professional c...

4.9 (8) 6 enrolled
£39.00 £279.00
Enrol now
£39.00 7h 24m · All Levels
Enrol now