有人知道一个简单的方法来转义HTML从字符串在jQuery?我需要能够传递一个任意字符串,并有它正确转义显示在HTML页面(防止JavaScript/HTML注入攻击)。我确信可以通过扩展jQuery来实现这一点,但目前我对框架的了解还不够,无法实现这一点。
当前回答
简单的JavaScript转义示例:
function escapeHtml(text) {
var div = document.createElement('div');
div.innerText = text;
return div.innerHTML;
}
escapeHtml("<script>alert('hi!');</script>")
// "<script>alert('hi!');</script>"
其他回答
这是一个简洁明了的JavaScript函数。它会将诸如"a few < many"这样的文本转义为"a few <许多”。
function escapeHtmlEntities (str) {
if (typeof jQuery !== 'undefined') {
// Create an empty div to use as a container,
// then put the raw text in and get the HTML
// equivalent out.
return jQuery('<div/>').text(str).html();
}
// No jQuery, so use string replace.
return str
.replace(/&/g, '&')
.replace(/>/g, '>')
.replace(/</g, '<')
.replace(/"/g, '"')
.replace(/'/g, ''');
}
这个答案提供了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'))
所有主流浏览器仍然支持短代码,考虑到旧网站的数量,我怀疑这种情况很快就会改变。
一个速度优化版本:
function escapeHtml(s) { let out = ""; let p2 = 0; for (let p = 0; p < s.length; p++) { let r; switch (s.charCodeAt(p)) { case 34: r = """; break; // " case 38: r = "&" ; break; // & case 39: r = "'" ; break; // ' case 60: r = '<' ; break; // < case 62: r = '>' ; break; // > default: continue; } if (p2 < p) { out += s.substring(p2, p); } out += r; p2 = p + 1; } if (p2 == 0) { return s; } if (p2 < s.length) { out += s.substring(p2); } return out; } const s = "Hello <World>!"; document.write(escapeHtml(s)); console.log(escapeHtml(s));
这是一个很好的安全的例子……
function escapeHtml(str) {
if (typeof(str) == "string"){
try{
var newStr = "";
var nextCode = 0;
for (var i = 0;i < str.length;i++){
nextCode = str.charCodeAt(i);
if (nextCode > 0 && nextCode < 128){
newStr += "&#"+nextCode+";";
}
else{
newStr += "?";
}
}
return newStr;
}
catch(err){
}
}
else{
return str;
}
}
如果你转义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进行转义。
推荐文章
- 一元加/数字(x)和parseFloat(x)之间的区别是什么?
- angularjs中的compile函数和link函数有什么区别
- 删除绑定中添加的事件监听器
- 如何在JSON中使用杰克逊更改字段名
- 很好的初学者教程socket.io?
- HtmlSpecialChars在JavaScript中等价于什么?
- 如何删除表中特定列的第一个字符?
- React: 'Redirect'没有从' React -router-dom'中导出
- 如何在React中使用钩子强制组件重新渲染?
- 我如何使用Jest模拟JavaScript的“窗口”对象?
- 我应该如何从字符串中删除所有的前导空格?- - - - - -斯威夫特
- 我如何等待一个承诺完成之前返回一个函数的变量?
- 在JavaScript中根据键值查找和删除数组中的对象
- 使嵌套JavaScript对象平放/不平放的最快方法
- 如何以及为什么'a'['toUpperCase']()在JavaScript工作?