Introduction to JavaScript DOM Page Elements

Description

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.