avoid javascript injection while maintaining HTML?

Question

 $("#id").append(dataHtml);

when injected with <script>alert('test)</script> an alert box appears on the screen showing test.I encoded the html but then it appeared as plain text.

I get the value of dataHtml from database.Because of some reasons I have to do this all on the client side using javascript/jquery.

How do i ignore such tags/injection while maintaing the html?

Answer 1

Append the script element with the type attribute set to something other than text/javascript, i.e. like this:

<script type="text/template">alert('test');</script>

This script tag will not be parsed or run as javascript.

Answer 2

you could just use a simple regular expression to remove all script tags:

dataHtml = dataHtml.replace(/<script.*>[\s\S]*.*[\s\S]*<\/script>/g,"");

some explanation:

• .* : all characters except linebreaks (* times)
• [\s\S]* : linebreaks

to test if everything matches as expected you can use an online tool with an example of your dataHtml value (http://www.regexr.com/ for example).