在Javascript中防止HTML和脚本注入

Question

假设我有一个带输入框的页面.用户在输入框中键入内容并点击按钮.该按钮触发一个函数,该函数获取键入文本框中的值,并将其输出到文本框下方的页面,无论出于何种原因.

现在,令人不安的是难以找到明确的答案,或者我不会问,但你会如何输出这个字符串:

<script>alert("hello")</script> <h1> Hello World </h1>

这样既不执行脚本也不显示HTML元素？

我在这里真正要问的是,是否存在一种在Javascript中避免HTML和脚本注入的标准方法.每个人似乎都有不同的方式(我使用jQuery所以我知道我可以简单地将字符串输出到文本元素而不是html元素,但这不是重点).

Answer 1

您可以编码<和>他们的HTML equivelant.

html = html.replace(/</g, "&lt;").replace(/>/g, "&gt;");

如何将HTML标记显示为纯文本

Answer 2

这是一个小脚本,使用jQuery,删除所有html并只保留文本:

myDiv.textContent = arbitraryHtmlString 

如果jQuery包含是一个问题,这可以在纯javascript(es6)中完成:

myDiv.textContent = arbitraryHtmlString