显然,这比我想象的要难找。它甚至是如此简单……

JavaScript中是否内置了与PHP的htmlspecialchars相同的函数?我知道自己实现它相当容易,但如果可用的话,使用内置函数会更好。

对于那些不熟悉PHP的人,htmlspecialchars将<htmltag/>转换为&lt;htmltag/&gt;

我知道escape()和encodeURI()不是这样工作的。


当前回答

您的解决方案代码有一个问题——它只转义每个特殊字符的第一次出现。例如:

escapeHtml('Kip\'s <b>evil</b> "test" code\'s here');
Actual:   Kip&#039;s &lt;b&gt;evil</b> &quot;test" code's here
Expected: Kip&#039;s &lt;b&gt;evil&lt;/b&gt; &quot;test&quot; code&#039;s here

下面是正常工作的代码:

function escapeHtml(text) {
  return text
      .replace(/&/g, "&amp;")
      .replace(/</g, "&lt;")
      .replace(/>/g, "&gt;")
      .replace(/"/g, "&quot;")
      .replace(/'/g, "&#039;");
}

更新

下面的代码将产生与上面相同的结果,但它的性能更好,特别是在大块文本上(感谢jbo5112)。

function escapeHtml(text) {
  var map = {
    '&': '&amp;',
    '<': '&lt;',
    '>': '&gt;',
    '"': '&quot;',
    "'": '&#039;'
  };
  
  return text.replace(/[&<>"']/g, function(m) { return map[m]; });
}

其他回答

js提供了一个函数:

_.escape(string)

转义插入HTML中的字符串,替换&、<、>、"和'字符。

http://underscorejs.org/#escape

它不是内置的JavaScript函数,但如果您已经在使用Underscore.js,如果要转换的字符串不是太大,那么它是比编写自己的函数更好的选择。

使用jQuery可以像这样:

var escapedValue = $('<div/>').text(value).html();

用jQuery转义HTML字符串

正如注释中提到的,双引号和单引号在此实现中保持原样。这意味着如果您需要将元素属性作为原始html字符串,则不应使用此解决方案。

照章办事

OWASP建议“[e]除字母数字字符外,[您应该]转义所有ASCII值小于256的字符,使用&#xHH;格式(或命名实体,如果可用),以防止切换[一个]属性。

这里有一个函数可以做到这一点,并有一个用法示例:

不安全功能 return键unsafe replace(。 - [u0000 - u002F \ u003A \ u0040 u005B - u0060 \ u007B \ u00FF] / g, c => '&#' + (' 1000 +。’这是c . charCodeAt(+ 0)。切片(四)?” ) 的 querySelector(“div”)的文件。innerHTML = <span class= + escapeHTML(' faeclass ' onclick="alert " ("test") + > +。’” escapeHTML(“<脚本>alert”(“attributes检查员”)\u003C/脚本>' ”< /跨越> < div > < / div >

您应该亲自验证我提供的实体范围,以验证函数的安全性。你也可以使用这个正则表达式,它具有更好的可读性,应该涵盖相同的字符代码,但在我的浏览器中性能下降了10%:

/(?![0-9A-for-z])[\u0000-\u00FF]/g

我正在详细说明一下ok。的答案。

为此,您可以使用浏览器的DOM函数。

var utils = {
    dummy: document.createElement('div'),
    escapeHTML: function(s) {
        this.dummy.textContent = s
        return this.dummy.innerHTML
    }
}

utils.escapeHTML('<escapeThis>&')

这返回&lt;escapeThis&gt;&

它使用标准函数createElement创建一个不可见的元素,然后使用函数textContent将任何字符串设置为其内容,然后使用innerHTML获取其HTML表示形式中的内容。

还有一种方法是完全放弃所有的字符映射,而是将所有不需要的字符转换为它们各自的数字字符引用,例如:

function escapeHtml(raw) {
    return raw.replace(/[&<>"']/g, function onReplace(match) {
        return '&#' + match.charCodeAt(0) + ';';
    });
}

注意,指定的RegEx只处理OP想要转义的特定字符,但是,根据转义HTML将要使用的上下文,这些字符可能是不够的。Ryan Grove的文章There's more to HTML转义than &, <, >, and”是关于这个主题的很好的阅读。根据您的上下文,为了避免XSS注入,很可能需要以下RegEx:

var regex = /[&<>"'` !@$%()=+{}[\]]/g