双重转义HTML

我使用了一个工具提示库，其中我将HTML转义并放置在title属性中。将鼠标悬停在该元素上时，它会隐藏HTML并将其放入工具提示中。双重转义HTML

我遇到的问题是递归。我在工具提示中有一个按钮，也有一个工具提示。例如：

nested_toooltip = "<h1>Hi, I'm a tooltip</h1>" 
tooltip = '<a title="' + escapeHtml(nested_tooltip) + '">Button</a>" 
document.write('<a title="' + escapeHtml(tooltip) + '">Button</a>"')

当您创建第一个工具提示时，它将忽略所有工具提示。我基本上得到格式不正确的HTML。有没有一种巧妙的方法可以实现HTML本质上可以逃脱两次？因为escapeHtml（escapeHtml（string））与escapeHtml（string）产生相同的结果。

来源

2011-11-19 Binary Logic

请向我们提供您使用的工具提示库 –

显示函数'escapeHTML'的来源。 –

可以使用CSS轻松解决您的问题，除非有某些原因需要使用动态创建的工具提示。 – qw3n

您需要一个合适的escapeHTML函数（相当于PHP的htmlentities()）。

function escapeHTML(s){ 
    var d = document.createElement("div");   //Container 
    d.innerHTML = "<a></a>";       //Placeholder 
    d.firstChild.setAttribute("title", s);   //Setter 
    return d.innerHTML.match(/^<a[^"]+"([^"]*)"/i)[1];//Returns entitied html 
}

的代码说明：

创建一个容器
在其中存储（<a>在这种情况下）一个虚设元件
使用setAttributw方法来设置的属性虚设元件上
获取容器的.innerHTML属性。这将返回虚拟元素加上实际的字符串。剥去虚拟元素，并返回“转义”字符串。

来源

2011-11-19 22:01:29

这有用，是否有递归的方式来做到这一点？哪里可能不止一个标题属性？ –

用我建议的代码替换你当前的'escapeHTML'函数。如果你确实需要一个递归函数，加入第二个参数'depth'，并用'return depth> 0替换最后一行？ escapeHTML（s，--depth）：s;'。 –

回答

相关问题