Hide and Display Text with DHTML
You can use innerHTML
to dynamically hide and display text.
Syntax
Here, {ID of element}
is the ID of an HTML element and {content}
is the new content to go into the element.
Basic Example
This code includes two functions and two buttons. Each function displays a different message and each button triggers a different function.
In the functions, the getElementById
refers to the HTML element by using its ID. We give the HTML element an ID of "myText" using id="myText"
.
So in the first function for example, you can see that document.getElementById('myText').innerHTML = 'Thanks!';
is setting the innerHTML of the "myText" element to "Thanks!".
Example With User Input
Here's an example of using innerHTML
with a text field. Here, we display whatever the user has entered into the input field.