Alison's New App is now available on iOS and Android! Download Now

Introduction to JavaScript DOM Page Elements

This free online course will arm you with the skills needed to create page elements on webpages using JavaScript DOM

Publisher: Laurence Svekis ✔
This course Introduction to JavaScript DOM Page Elements will equip you with the basic knowledge needed to modify elements on webpages with DOM using JavaScript. This course teaches how DOM relates with JavaScript code the methods of selecting elements and how to add and remove objects using append and prepend. By taking this course, you will learn about event listeners and their types and also how to add animation frames to the page.
Introduction to JavaScript DOM Page Elements
  • Duration

    1.5-3 Hours
  • Students

  • Accreditation


Share This Course And
Earn Money  

Become an Affiliate Member





View course modules


This Introduction to JavaScript DOM Page Elements course on Alison.com has been designed to teach learners the basic knowledge and techniques required to create and update page elements using JavaScript DOM. The course begins with an introduction to DOM, here, you will be taught the functions of DOM and how it helps improve the functionality of webpages which includes connecting web pages to scripts or programming languages by representing the structure of a document. In this free online course on Alison, you will learn how to use the Google Chrome dev tool to debug and test your HTML and JavaScript codes on windows and Mac OS, next, you will learn the various methods of selecting and updating page elements which will include using the query selector and you will also learn how to select and update all matching page elements using the JavaScript QuerrySelectorAll and also how to select and return multiple elements into a node list, update the count of elements along with the text content of an element.

In this course, you will learn how to select an element and update the style values, and also how to set the attributes of the page element and then you will be shown how to select elements and update the HTML of element and add HTML to the page elements with the innerHTML property value and also how to update the color and background color of the selected element, you will be taught how to apply various styling values to the style attribute with JavaScript. Next, you will learn some class list methods to toggle an existing class, add, remove classes and check if the class exists on an element returning a Boolean value and then you will learn the Append, Prepend, AppendChild to parent Element methods of adding page elements to the page. Finally, you will be shown how to navigate the DOM tree by selecting a starting element and moving to its related elements with JavaScript Code, next you will learn the functions of event listeners and how to add and remove event listeners. You will also learn how to create and track mouse events and as well as track keyboard events and how to attach events to input fields.

DOM is an abbreviation for document object model and it is a programming interface for web documents, the DOM represents the document as nodes and objects enabling programming languages such as JavaScript and HTML to interact and modify the page elements or contents. By taking this course on Alison.com, you will learn how to create and modify page elements and also how to add event listeners for mouse and keyboard events, so, what are you waiting for? Take this free online course now and gain a new skill.

Start Course Now