如何在有主題標籤的 CSS 和 jQuery 選擇器中使用「#」？

在有主題標籤的CSS 和jQuery 選擇器中使用「#」

問題

考慮以下HTML：

<code class="html"><div id='test#1'>test1</div>
<div id='test#2'>test2</div></code>

以下程式碼片段將無法如預期般運作：

<code class="css">#test#1 {
  color: red;
}</code>

<code class="jQuery">$('#test#2').css('color', 'blue');</code>

解決方案

要使用「#」等元字元作為名稱的文字部分，必須對它們進行轉義帶反斜線：

<code class="css">#test\#1 {
  color: red;
}</code>

<code class="jQuery">$('#test\#2').css('color', 'blue');</code>

建議

為了保持一致性並遵循網路標準，最好避免在ID 中使用「#」。 ID 必須以字母開頭，且只能包含字母、數字、連字號、底線、冒號和句點。

轉義“.”在 ID 中

如果 ID 包含“.”，您還應該轉義它：

<code class="html"><div id='test.1'></div></code>

<code class="css">#test\.1 {
  color: red;
}</code>

<code class="jQuery">$('#test\.1').css('color', 'blue');</code>

以上是如何在有主題標籤的 CSS 和 jQuery 選擇器中使用「#」？的詳細內容。更多資訊請關注PHP中文網其他相關文章！