When using the DOM in your script to access an HTML element, you also have access to all of that element’s properties.
This includes the ability to modify the contents of the element as well as its attributes and properties— that can range from modifying the text inside a
p element to assigning a new background color to a
You can access and set the contents of an element with the
For example, the following code reassigns the inner HTML of the body element to the text ‘The cat loves the dog’:
document.body.innerHTML = 'The cat loves the dog.';
.innerHTML property can also add any valid HTML, including properly formatted elements. The following example assigns an
h2 element as a child inside the
document.body.innerHTML = '<h2>This is a heading</h2>';
.innerHTML property to modify the content of the
body to display the text ‘This is the text of the body element’.
Notice that the previous content inside of
body has been replaced