Javascript to Dynamically Change Styles
Description :
Javascript can be used to change the style of a DOM element as well. Once we are able to get access to a DOM element, we can dynamically change the style through Javascript to whatever we want using Javascript.
Example :
The following paragraph is displayed using the following code:
<p id="para-1"> Hello! </p>
Hello!
And we have a button:
When we click the button, our JS catches the click event from the button
and changes the font size and the text color of the paragraph.
To do this, we use the DOMElement. style.fontSize
and
DOMElement.style.color
attributes. The code for this
can be found below:
document.getElementById("para-1").style.color = "blue";
document.getElementById("para-1").style.fontSize = "28pt";