El método insertNode() inserta un Node al comienzo del Rango.
El Rango actualizado consiste en un nuevo Node insertado antes del Rango del último contenido del Rango.
Sintaxis:
range.insertNode( newNode );
Parámetros: este método acepta un solo parámetro como se mencionó anteriormente y se describe a continuación:
- newNode: El Node que se insertará al inicio del rango.
Valor devuelto : este método no devuelve ningún valor.
Ejemplo: Este ejemplo muestra cómo insertar un Node antes del contenido del rango usando el método insertNode() . Para aclarar, los cambios en el contenido del rango, hicimos que la consola registrara el nuevo rango en texto de string usando el método toString() .
HTML
<!DOCTYPE html>
<html>
<head>
<title>
HTML DOM range insertNode() method
</title>
</head>
<body>
<h1>GeeksforGeeks</h1>
<p>Range Content</p>
<button onclick="insert()">
Click Here to insert the Node
</button>
<p id="element">Node element </p>
<script>
var range = document.createRange();
range.selectNode(document
.getElementsByTagName("p").item(0));
const element = document
.getElementById('element');
console.log("Before Button Click:",
range.toString());
function insert() {
range.insertNode(element);
console.log("After Button Click:",
range.toString());
}
</script>
</body>
</html>
Producción:
Antes de hacer clic en el botón:
Después de hacer clic en el botón:
Navegadores compatibles:
- Google cromo 1
- Borde 12
- Firefox 1
- Safari 1
- Ópera 9
- explorador de Internet 9