有人知道一个简单的方法来转义HTML从字符串在jQuery?我需要能够传递一个任意字符串,并有它正确转义显示在HTML页面(防止JavaScript/HTML注入攻击)。我确信可以通过扩展jQuery来实现这一点,但目前我对框架的了解还不够,无法实现这一点。
当前回答
我增强了mustache.js示例,将escapeHTML()方法添加到字符串对象中。
var __entityMap = {
"&": "&",
"<": "<",
">": ">",
'"': '"',
"'": ''',
"/": '/'
};
String.prototype.escapeHTML = function() {
return String(this).replace(/[&<>"'\/]/g, function (s) {
return __entityMap[s];
});
}
这样就很容易使用"Some <text>, more Text&Text".escapeHTML()
其他回答
简单的JavaScript转义示例:
function escapeHtml(text) {
var div = document.createElement('div');
div.innerText = text;
return div.innerHTML;
}
escapeHtml("<script>alert('hi!');</script>")
// "<script>alert('hi!');</script>"
(function(undefined){
var charsToReplace = {
'&': '&',
'<': '<',
'>': '>'
};
var replaceReg = new RegExp("[" + Object.keys(charsToReplace).join("") + "]", "g");
var replaceFn = function(tag){ return charsToReplace[tag] || tag; };
var replaceRegF = function(replaceMap) {
return (new RegExp("[" + Object.keys(charsToReplace).concat(Object.keys(replaceMap)).join("") + "]", "gi"));
};
var replaceFnF = function(replaceMap) {
return function(tag){ return replaceMap[tag] || charsToReplace[tag] || tag; };
};
String.prototype.htmlEscape = function(replaceMap) {
if (replaceMap === undefined) return this.replace(replaceReg, replaceFn);
return this.replace(replaceRegF(replaceMap), replaceFnF(replaceMap));
};
})();
没有全局变量,一些内存优化。 用法:
"some<tag>and&symbol©".htmlEscape({'©': '©'})
结果是:
"some<tag>and&symbol©"
转义html特殊(UTF-8)
function htmlEscape(str) {
return str
.replace(/&/g, '&')
.replace(/"/g, '"')
.replace(/'/g, ''')
.replace(/</g, '<')
.replace(/>/g, '>')
.replace(/\//g, '/')
.replace(/=/g, '=')
.replace(/`/g, '`');
}
对于unescape html特殊(UTF-8)
function htmlUnescape(str) {
return str
.replace(/&/g, '&')
.replace(/"/g, '"')
.replace(/'/g, "'")
.replace(/</g, '<')
.replace(/>/g, '>')
.replace(///g, '/')
.replace(/=/g, '=')
.replace(/`/g, '`');
}
我知道我来这个派对有多晚,但我有一个非常简单的解决方案,不需要jQuery。
escaped = new Option(unescaped).innerHTML;
编辑:不转义引号。需要转义引号的唯一情况是,内容将内联粘贴到HTML字符串中的属性。我很难想象这样做会是好的设计。
编辑3:要获得最快的解决方案,请检查上面萨拉姆的答案。这个是最短的。
这个答案提供了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'))
所有主流浏览器仍然支持短代码,考虑到旧网站的数量,我怀疑这种情况很快就会改变。