HTML tutorial
CSS3 tutorial
Bootstrap tutorial
JavaScript tutorial
JQuery tutorial
AngularJS tutorial
React tutorial
NodeJS tutorial
PHP tutorial
Python tutorial
Python3 tutorial
Django tutorial
Linux tutorial
Docker tutorial
Ruby tutorial
Java tutorial
C tutorial
C ++ tutorial
Perl tutorial
JSP tutorial
Lua tutorial
Scala tutorial
Go tutorial
ASP.NET tutorial
C # tutorial
Through the HTML DOM, JavaScript can access the HTML document for each element.
The easiest way to change the content of the element is to use the innerHTML property.
The following example changes <p> element in HTML content:
Through the HTML DOM, you can access the object HTML style object.
The following example changes the HTML paragraph styles:
<p id="p2">Hello world!</p>
<script>
document.getElementById("p2").style.color="blue";
</script>
</body>
</html>
HTML DOM allows you to execute code when an event occurs.
When the HTML element "something is happening", the browser will generate an event:
You can learn more about the event in the next chapter.
The following two examples to change the background color <body> element in the button is clicked:
In this case, the function performs the same code:
The following example changes the text <p> element in the button is clicked: