En esta clase veremos otra forma de agregar nodos, son mas dinamicas pero tienen un problema de seguridad.


Node.innerHTML

Este método nos permite escribir HTML.

const div = document.getElementById("container");

div.innerHTML = "<div>Hola Platzi!</div>";

Node.outerHTML

Este método nos permite leer HTML.

const div = document.getElementById("container");

console.log(div.outerHTML);
// E.O: <div> Hola Platzi! </div>

Problema

El problema con estas formas de inserciones es que permiten la inserción XSS, es decir, código maligno, y cualquier usuario programador malicioso podría meter scripts molestos.

<aside> 💡 Imagina que cada que un usuario llegue a tu página le salga un alert… ¡Sería catastrófico! Siempre sanitiza (remover caracteres especiales) los inputs de tus usuarios.

</aside>