有人知道一个简单的方法来转义HTML从字符串在jQuery?我需要能够传递一个任意字符串,并有它正确转义显示在HTML页面(防止JavaScript/HTML注入攻击)。我确信可以通过扩展jQuery来实现这一点,但目前我对框架的了解还不够,无法实现这一点。
当前回答
这个答案提供了jQuery和普通的JS方法,但这是不使用DOM的最短方法:
unescape(escape("It's > 20% less complicated this way."))
转义字符串:它%27s%20%3E%2020%25%20less%20complicated%20this%20way。
如果转义的空格让你感到困扰,试试:
unescape(escape("It's > 20% less complicated this way.").replace(/%20/g, " "))
转义字符串:这样就不那么复杂了。
不幸的是,escape()函数在JavaScript 1.5版中已弃用。encodeURI()或encodeURIComponent()是替代方案,但它们忽略了',所以最后一行代码将变成这样:
decodeURI(encodeURI("It's > 20% less complicated this way.").replace(/%20/g, " ").replace("'", '%27'))
所有主流浏览器仍然支持短代码,考虑到旧网站的数量,我怀疑这种情况很快就会改变。
其他回答
如果你有underscore.js,使用_.escape(比上面发布的jQuery方法更有效):
_.escape('Curly, Larry & Moe'); // returns: Curly, Larry & Moe
如果你转义HTML,只有三个我能想到,这将是真正必要的:
html.replace(/&/g, "&").replace(/</g, "<").replace(/>/g, ">");
根据您的用例,您可能还需要执行“to "”之类的操作。如果列表足够大,我就使用数组:
var escaped = html;
var findReplace = [[/&/g, "&"], [/</g, "<"], [/>/g, ">"], [/"/g, """]]
for(var item in findReplace)
escaped = escaped.replace(findReplace[item][0], findReplace[item][1]);
encodeURIComponent()只会对url进行转义,而不会对HTML进行转义。
简单的JavaScript转义示例:
function escapeHtml(text) {
var div = document.createElement('div');
div.innerText = text;
return div.innerHTML;
}
escapeHtml("<script>alert('hi!');</script>")
// "<script>alert('hi!');</script>"
你可以很容易地用香草js做到这一点。
只需在文档中添加一个文本节点。 它将被浏览器转义。
var escaped = document.createTextNode("<HTML TO/ESCAPE/>")
document.getElementById("[PARENT_NODE]").appendChild(escaped)
我知道我来这个派对有多晚,但我有一个非常简单的解决方案,不需要jQuery。
escaped = new Option(unescaped).innerHTML;
编辑:不转义引号。需要转义引号的唯一情况是,内容将内联粘贴到HTML字符串中的属性。我很难想象这样做会是好的设计。
编辑3:要获得最快的解决方案,请检查上面萨拉姆的答案。这个是最短的。