I have an html page in which the user will be able to insert custom HTML content. For instance, it could be something like this:
<div class='main-container'>
<div class='previous-stuff'>
...
</div>
<div class='custom-content'>
{Custom content from user}
</div>
<div class='next-stuff'>
...
</div>
</div>
I used document.querySelector('custom-content').innerHtml = customContent
to set the content. If the custom content has a unclosed div
, for instance, it will mess up with the rest of the page.
Is there any way to "shield" the rest of the page from problems from the custom content?
I don't think its relevant, but the page is a WordPress page.