In this tutorial, we will learn how to further alter the DOM by modifying styles, classes, and other attributes of HTML element nodes.
This will give you a greater understanding of how to manipulate essential elements within the DOM.
In the previous tutorial in this series, “How To Make Changes to the DOM,” we covered how to create, insert, replace, and remove elements from the Document Object Model (DOM) with built-in methods.
By increasing your proficiency in manipulating the DOM, you are better able to utilize Java Script’s interactive capabilities and modify web elements.
Some of the most common HTML attributes are the // Assign image element const img = document.query Selector('img'); Attribute('src'); // returns true Attribute('src'); // returns "…shark.png" img.remove Attribute('src'); // remove the src attribute and value methods are used to directly modify the DOM.
The class attribute corresponds to CSS class selectors.
Normally changes are batched and rendered asynchronously.
Synchronous rendering has a performance cost, but can be useful in a few scenarios: only picks up observable changes such as those made with Polymer's array mutation methods.
Until recently, a popular Java Script library called j Query was most often used to select and modify elements in the DOM.
j Query simplified the process of selecting one or more elements and applying changes to all of them at the same time.