Secure way to output encoding HTML for insert raw html via javascript
I want to be 100% secure, I create raw html this way:
const template = document.createElement('template')
template.innerHTML = html_raw
const cloned = template.content.cloneNode(true)
document.querySelector('#app').appendChild(cloned);
When I build the html I insert independently every string to his respective html element (from json data object) who pass the validation function
In the validation function, I white list this characters: a-z0123456789(),.:-_/@%'space
obviously a space is
after validate the string I replace this characters (),.:-_/@%'space to HTML encoding, for example ( equal to (
my question is, is secure HTML encoding in this way, inserting via innerHTML from html_raw related to HTML context (xss attack)?
I saw this question about innerHTML script can not be executed: https://stackoverflow.com/questions/2592092/executing-script-elements-inserted-with-innerhtml
I bypass innerHTML with: <img src="" onerror=alert(0)> but if I replace with HTML encoding: <img src="" onerror=alert(0)> does not execute the script
