Loading Please Wait...
The HTML DOM allows JavaScript to change the style of HTML elements.
To change the style of an HTML element, use this syntax:
element.style.property = new style
The following example changes the style of a <p> element:
<html>
<body>
<p id="examplePara">Hello World!</p>
<script>
document.getElementById("examplePara").style.color = "blue";
</script>
</body>
</html>
The HTML DOM allows you to execute code when an event occurs.
Events are generated by the browser when "things happen" to HTML elements:
This example changes the style of the HTML element with id="examplePara", when the user clicks a button:
<html>
<body>
<p id="examplePara">Hello World!</p>
<button type="button"
onclick="document.getElementById('examplePara').style.color = 'red'">
Click Me!
</button>
</body>
</html>
<html>
<body>
<p id="examplePara">This paragraph will change.</p>
<button type="button"
onclick="document.getElementById('examplePara').style.color = 'red'">
Red Text
</button>
<button type="button"
onclick="document.getElementById('examplePara').style.color = 'black'">
Black Text
</button>
<button type="button"
onclick="document.getElementById('examplePara').style.display = 'block'">
Show Text
</button>
<button type="button"
onclick="document.getElementById('examplePara').style.display = 'none'">
Hide Text
</button>
</body>
</html>
How you feel about this blog:
Share this blog on:
If you find any error in the turtorials, or want to share your suggestion/feedback, feel free to send us email at: info@lynxsia.com
Contact Us
We are concern with various development process like website design & development, E-commerce development, Software development, Application development, SMS & Bulk SMS Provider, PWA Development, and many more..
Copyright © , Lynxsia IT Solutions, All rights reserved