Para la creación de un nodo de texto disponemos del siguiente método de la clase document:
let nt=document.createTextNode('Texto del nodo')
Para añadirlo luego a un párrafo por ejemplo debemos llamar al método appendChild:
let nparrafo=document.getElementById('parrafo') nparrafo.appendChild(nt)
Veamos un ejemplo en el que cada vez que se presione un botón se añada un nodo de texto a un párrafo mostrando cuántos nodos de texto se han añadido:
pagina1.html
<!DOCTYPE html> <html lang="es"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Prueba</title> </head> <body> <p id="parrafo">Texto inicial:</p> <input type="button" value="Agregar nodo de texto" onClick="agregar()"> <script src="funciones.js"></script> </body> </html>
funciones.js
let contador = 1 function agregar() { let nt = document.createTextNode('Nuevo texto ' + contador + '-') let nparrafo = document.getElementById('parrafo') nparrafo.appendChild(nt) contador++ }
A la variable contador la definimos fuera de la función para que sea global.
Cada vez que se presiona el botón creamos un nodo de texto agregándole el valor del contador:
let nt = document.createTextNode('Nuevo texto ' + contador + '-')
Seguidamente obtenemos una referencia al párrafo:
let nparrafo = document.getElementById('parrafo')
finalmente añadimos el nodo de texto al párrafo:
nparrafo.appendChild(nt)