HTML属性值中是否允许使用单引号/双引号？

Question

我正在尝试设置包含单引号的属性值：

var attr_value = "It's not working";
var html = "<label my_attr='" + attr_value + "'>Text</label>";
$('body').html(html);

但是，我得到以下结果：

<label working="" not="" s="" my_attr="It">Text</label>

我该如何解决这个问题？

属性值中是否允许使用双引号？

Answer 1

是的，属性值中允许使用两个引号，但您必须HTML转义您用作属性值分隔符的引用，以及其他HTML特殊字符，如<和{{1} }：

&

但是，通常情况下，不试图通过HTML字符串一起破解文档会好得多。每次忘记逃避时，都会冒错误和HTML注入（导致跨站点脚本安全漏洞）。相反，使用DOM样式的方法，如function encodeHTML(s) { return s.split('&').join('&amp;').split('<').join('&lt;').split('"').join('&quot;').split("'").join('&#39;'); } var html= '<label my_attr="'+encodeHTML(attr_value)+'">Text</label>'; ，attr()和构造快捷方式：

text()

Answer 2

您可以在双引号内使用单引号或在单引号内使用双引号。如果要在双引号内使用单引号内的单引号或双引号，则必须对它们进行HTML编码。

有效标记：

<label attr="This 'works'!" />
<label attr='This "works" too' />
<label attr="This does NOT \"work\"" />
<label attr="And this is &quot;OK&quot;, too" />

Answer 3

使用双引号作为属性分隔符：

var html = "<label my_attr=\"" + attr_value + "\">Text</label>";

Answer 4

var attr_value = "It's not working"