Cuando permito a los usuarios insertar datos como argumento para el JSinnerHTML funciona así:

element.innerHTML = “User provided variable”;

Comprendí que para evitar XSS, tengo que codificar HTML y luego JS codificar la entrada del usuario porque el usuario podría insertar algo como esto:

<img src=a onerror='alert();'>

Solo la codificación HTML o solo JS no ayudaría porque el.innerHTML Como entendí, el método decodifica la entrada antes de insertarla en la página. Con la codificación HTML + JS, noté que el.innerHTML decodifica solo el JS, pero la codificación HTML permanece.

Pero pude lograr lo mismo mediante la doble codificación en HTML.

Mi pregunta es: ¿podría alguien proporcionar un ejemplo de por qué debería codificar HTML y luego codificar JS, y no codificar doblemente en HTML cuando utilizo el.innerHTML ¿método?