Question

我有一个id =“A B”的元素。以下代码失败：

<input type="text" id="A B">
<script>$("#A B").click(function(){alert();});</script>

以下代码不会失败：

<input type="text" id="AB">
<script>$("#AB").click(function(){alert();});</script>

Answer 1

虽然在HTML中ID属性值中有空格在技术上无效（请参阅@ karim79的回答），但实际上可以使用jQuery选择它。

请参阅http://mothereffingcssescapes.com/#A%20B：

<script>
  // document.getElementById or similar
  document.getElementById('A B');
  // document.querySelector or similar
  $('#A\\ B');
</script>

jQuery使用类似Selectors API的语法，因此您可以使用$('#A\\ B');选择id="A B"的元素。

要在CSS中定位元素，您可以像这样转义它：

<style>
  #A\ B {
    background: hotpink;
  }
</style>

Answer 2

正如他们所提到的，你不应该在id中使用空格。但无论如何，这不适合你吗？

$("[id='A B']").click(...)

编辑：是的，有效，经过测试！不要杀我，标准爱好者！ ;-P

Answer 3

HTML4和HTML5都不允许在ID属性值中使用空格字符。

HTML 4.01规范声明ID令牌必须以字母开头   （[A-Za-z]）并且可以跟随任意数量的字母，数字   （[0-9]），连字符（ - ），下划线（_），冒号（:)和句点（。）。   对于class属性，没有这样的限制。类名可以   包含任何字符，并且它们不必以字母开头   是有效的。

HTML5摆脱了对id属性的额外限制。该   只剩下要求 - 除了在文件中是独一无二的 - 是   该值必须至少包含一个字符（不能为空），   并且它不能包含任何空格字符。

来源：

http://mathiasbynens.be/notes/html5-id-class

Answer 4

id中不应该有空格，但这似乎有效：

$("[id=A B]")

Answer 5

ID tokens must begin with a letter ([A-Za-z]) and may be followed by any number of letters, digits ([0-9]), hyphens ("-"), underscores ("_"), colons (":"), and periods (".").

该引用是从另一个stackoverflow回答中提取的：jquery IDs with spaces

jQuery：处理id属性中的空格

5 个答案: