DOM CSS

The HTML DOM enables users to change or modify the style of HTML elements using JavaScript.

To modify the style of an HTML element, use the following syntax:

document.getElementById(id).style.property = myStyle;

The following example changes the style of a <span> element:

Input:-

Output :-

Using Events

The HTML DOM allows users to execute dynamic code when specific events occur.

Events are triggered by the browser when certain actions are taken on HTML elements. Examples of events include:

• Clicking an element
• Page loading
• Value change in input fields

The following example changes the style of the HTML element with the id="h3" when the user clicks a button:

Input:-

Output (Before Click):-

Output (After Click):-