如何在使用哈希时将id作为选择器？

Question

假设以下html：

<div id='test#1'>test1</div>
<div id='test#2'>test2</div>

现在，以下不起作用，为什么？

...的CSS

#test#1{color: red;}

...的jQuery

$('#test#2').css('color','blue');

Answer 1

使用任何元字符，例如！“＃$％＆amp;'（）* +，。/：;＆lt; =＆gt;？@ [] ^`{|}〜作为字面的一部分一个名称，必须使用反斜杠进行转义：

css方式：

#test\#1{
    color: red;
}

jquery方式：

$('#test\\#2').css('color','blue');

demo

---

<强>建议：

您不应在身份see more for detail

中使用＃

  

ID和NAME令牌必须以字母（[A-Za-z]）开头，后面可以跟任意数量的字母，数字（[0-9]），连字符（“ - ”），下划线（“ _“），冒号（”：“）和句号（”。“）。

---

所以，你可能也想知道id =“test.1”可以使用，为此你也应该如上所述逃避角色。

Answer 2

您可以使用反斜杠#转义\：

#test\#1{
    color: red;
}

使用jQuery，您可以采用相同的方式，但需要使用另一个反斜杠来转义\：

  

使用任何元字符（例如   ！＆＃34;＃$％＆amp;＆＃39;（）* +，。/：;＆lt; =＆gt;？@ [] ^`{|}〜）作为名称的字面部分，它必须   用两个反斜杠转义：\\

$('#test\\#2').css('color','blue');

<强> Fiddle Demo

但是，#根据HTML 4 specification不是有效的唯一标识符：

  

ID和NAME令牌必须以字母（[A-Za-z]）开头，可能是   后跟任意数量的字母，数字（[0-9]），连字符（＆＃34; - ＆＃34;），   下划线（＆＃34; _＆＃34;），冒号（＆＃34;：＆＃34;）和句号（＆＃34;。＆＃34;）。

和HTML 5 specification：

  

该值必须在元素主页中的所有ID中唯一   子树，必须包含至少一个字符。价值不能   包含任何空格字符。

因此，您应该删除身份证中的第二个#。

Answer 3

使用特殊字符时必须使用\

var test1 = $('#test\\#1');

http://bugs.jquery.com/ticket/4944