Log in
Welcome to Kingston Open College. Please log in to access your account and explore a world of knowledge and growth.
Sign in to your Account
About Us
At Kingston, we offer the best in e-learning courses, featuring regulated and endorsed qualifications for your career growth.
We Are Social
Follow Us:
Contact Us
Learn DOM Manipulation with JavaScript
( 6 Reviews )
7 hours, 24 minutes
95 Curriculum
25 Students
Course Overview
This premium QLS endorsed Learn DOM Manipulation with JavaScript course comes with intensive study modules, dedicated tutor assistance, customer support, flexible learning opportunity and a globally recognised certification all-together. Thus, successful completion of our Learn DOM Manipulation with JavaScript course will give you limitless opportunities anywhere and everywhere, since the value of QLS endorsed courses are quite high, to say the least!!
Whatâs more, the quality of our first-class course is uncompromising for both you and us. You will be taught the richest of materials from this exquisite Learn DOM Manipulation with JavaScript course, enabling you to open up a vast world of opportunities for you to grasp and gain success from. For the price point, this course is actually an absolute steal! Itâs an investment you absolutely do not want to miss out on!
So, why delay any longer? Benefit your career progression by joining us today and distinguish yourself as, unquestionably, the most skilled one in your workplace!
Key features
- E-learning and E-assessment system with flexibility.
- Learners get interactive resources.
- Expert advice from qualified professionals
- Globally recognised certificate.
- 14 days refund guarantee.
- 24/7 Tutor Support
Learning Outcome
- Have a thorough grasp of the Learn DOM Manipulation with JavaScript in just a few hours, rather than years.
- Acquainted yourself with the most recent industry developments and changes.
- Adjust and adapt in any working setting by combining your academic and practical expertise.
- Seek assistance from our qualified teachers at any moment.
- Get your hands on professionally developed and prepared course materials.
- Study whenever and from anywhere you wish.
Course Details
We, as one of the leading eLearning service providers across the globe, strive to provide all our learners with the best eLearning experience possible that can make a real difference in their career progression.Â
- 7+ hours of video lectures and digital resources are available on demand.
- Learn at your own speed with affordable, high-quality E-learning content.Â
- When you finish the course, you will be given a certificate of completion.
- Enhance your resume from a globally recognised Accredited Qualification.
- You’ll discover how effective salespeople use a researched and proven technique to boost their careers.
- You’ll be able to successfully implement several practical sales strategies and have a deeper understanding of your consumers.
Our course is open for everyone. This Learn DOM Manipulation with JavaScript is ideal for those who aspire to gain in-depth knowledge & efficient skill to embark into the relevant sector as a promising potential.Â
- Unit 01:Â Course Introduction
- Unit 02:Â DOM Fundamentals
- Unit 03:Â Code DOM Adventure
- Unit 04:Â Creating elements
- Unit 05:Â Dynamic CSS
- Unit 06:Â Profiling the pixel pipeline
- Unit 07:Â Animation using DOM changes
- Unit 08:Â Planning DOM changes with a state model
- Unit 09:Â Easy bundling
- Unit 10:Â DOM updates with basic state driven development
- Unit 11:Â The player, Interacting with user input
- Unit 12:Â Interactive DOM, breaking walls
- Unit 13:Â Portal to exit the game
- Unit 14:Â Animating all the things
- Unit 15:Â DOM Sound effects
Learners must submit a comprehensive summerised assignment on all the units that will be assessed by our expert tutor if all the learning outcomes are met as per the standard set by QLS. After the quality check, learner will be provided with the Learn DOM Manipulation with JavaScript certificate.
An endorsed certificate will be issued to learners at the end of the course as recognition of course completion. Provided that learner completes all the assessment of a course can claim for certificate.Â
QLS endorsed this certified course as a highly qualified, non-regulated provision and training programme. There will be a trainer to answer all your questions including your progression routes into further higher education. It is a non-accredited course.
There are no formal requirements needed for this Learn DOM Manipulation with JavaScript course. So learners do not require any prior qualifications to enrol in this course.Â
-
What is the DOM? 00:02:00 -
Your first DOM update 00:05:00
-
Course Project: Code DOM Adventure 00:04:00
-
HTML and the DOM 00:05:00
-
DOM standards 00:05:00
-
The BOM 00:04:00
-
The CSSOM 00:03:00
-
The tree (Data structure) 00:05:00
-
The DOM tree 00:11:00
-
The DOM and JavaScript 00:01:00
-
App architecture 00:08:00
-
Challenge solution: The exit screen 00:04:00
-
App skeleton 00:05:00
-
The splash screen file 00:03:00
-
Download our asset kit now! 00:03:00
-
Including the assets 00:03:00
-
Wiring the splash screen element 00:02:00
-
Creating elements at runtime 00:03:00
-
Appending HTML strings width append() 00:02:00
-
Appending nodes with append or append Child 00:03:00
-
Script order matters 00:04:00
-
Specifying classes to elements 00:04:00
-
Working with static styles 00:04:00
-
Defining styles at runtime 00:04:00
-
Querying the DOM to find elements 00:05:00
-
The pixel pipeline 00:02:00
-
Identifying bad practices 00:04:00
-
Profiling runtime performance 00:04:00
-
Batching DOM updates with document fragments 00:05:00
-
Too many nodes 00:04:00
-
Removing nodes from the DOM 00:06:00
-
The animation frames 00:06:00
-
Our animate method 00:04:00
-
Our working animation! 00:06:00
-
Stopping the animation 00:08:00
-
Let’s build the level! 00:02:00
-
2. Our state model to control the DOM from state. 00:10:00
-
Normalizing attributes 00:04:00
-
Our level class 00:04:00
-
Arrays, references and non-iterable empty slots 00:05:00
-
Building our state with an ugly oneliner 00:05:00
-
Write code for humans and normalize your code 00:05:00
-
Rendering the level element 00:05:00
-
Things are getting messy 00:06:00
-
Easy bundling 00:06:00
-
Bundle with the start script 00:01:00
-
Our dev server 00:02:00
-
Let’s use DOMContentLoaded and ES Modules (ESM) 00:07:00
-
Dynamic style elements with CSS as ESM imports 00:04:00
-
Designing the shape of our state 00:02:00
-
Initializing our state in preparation to render DOM elements 00:05:00
-
DOM updates from state 00:08:00
-
Updates to state are reflected in the DOM 00:03:00
-
Modeling and render our chip walls 00:06:00
-
The player – Tech approach 00:02:00
-
Rendering the player with the DOM 00:07:00
-
Box model and global styles 00:06:00
-
Manipulating inline styles with the DOM 00:04:00
-
Moving the player by changing its state 00:06:00
-
DOM keyboard event listeners 00:07:00
-
Mapping and filtering DOM events data 00:04:00
-
Can the player move? – Tech approach 00:03:00
-
Preventing overlapping DOM elements 00:12:00
-
Prepare interactive frames 00:08:00
-
Resetting className and adding interactive frames on DOM events 00:06:00
-
Update frames without moving the element on DOM events 00:03:00
-
Adding random DOM elements 00:06:00
-
DOM events when pressing the space key 00:05:00
-
Creating elements on DOM events 00:05:00
-
z-index manifest 00:04:00
-
Dynamic element IDs with the DOM 00:07:00
-
Interacting with other elements using the state model 00:06:00
-
Remove surrounding walls 00:04:00
-
Adding the portal to the screen 00:07:00
-
Random elements on the screen 00:05:00
-
Grouping inline CSS DOM updates 00:03:00
-
Exiting the game, when two elements cross paths 00:04:00
-
Challenge, your turn to build the exit screen 00:03:00
-
Challenge solution, my turn to build the exit screen 00:04:00
-
Hiding the portal behind a wall 00:05:00
-
Removing DOM event listeners 00:04:00
-
Rendering the splash screen 00:04:00
-
Swapping screens 00:02:00
-
Animating the portal 00:04:00
-
CSS kit – animations 00:03:00
-
Request animation frame and delaying animations 00:09:00
-
Animating with a parent css class 00:03:00
-
Old TV effect 00:02:00
-
Animating with delayed animation 00:11:00
-
Optimizing frames 00:03:00
-
Final frame optimizations 00:04:00
-
Dynamic audio elements 00:07:00
-
Interactive sound effects with DOM events 00:04:00
-
Delayed audio effects with callbacks and DOM events 00:04:00
-
Final lecture, final sound effect! exiting the game 00:03:00
Course Reviews
No Reviews found for this course.
Course Info
Lessons : 95
Assignments : No assignments
Duration : 7 hours, 24 minutes
Access : 1 year
Enrol now, pay later in easy instalments(Interest free) with Clearpay.
Related Courses
January 26, 2026
47 Curriculum
9 Students
January 23, 2026
64 Curriculum
12 Students
Want courses at lower price?
Join our email list for early access and rewards.
Subscribe
Heart of Healthcare Skills
Master Business Skill
Learn to Lead
Next-Gen Tech Skills
Creative Arts & Design
Ready To Get Started ?
We at Kingston provide high-quality Ofqual regulated qualification along with proper guidance. We collaborated with recognised awarding bodies which means you as a learner will get the best high quality professional qualification required for your current & future career growth.
Main Menu
