In this example, text is added to the paragraph. Each time you click the button below,
new text is added. The new text that is added is the text in the input edit box below. Try
clicking the button to see if it works.
My special paragraph
As in previous lessons in this series, the paragraph in question is given a
unique ID. The code for the paragraph is:
That is, the paragraph is given the ID, "example1".
The "Append Text" button calls a function:
<input type="button" value="append Text" onclick="appendNewText()" />
The function, "appendNewText()" is as follows:
var newText = document.createTextNode
var para = document.getElementById("example1");
First we create a new text node for the paragraph using "createTextNode()".
The value of the new text comes from the input edit with the ID "t1". We use
"getElementById" to find this, and we use "getElementById" similarly
to find the paragraph we want to change ("example1").
Finally, we append the new text to the node we created at the beginning of the function