自定义 data-* 属性的名称中允许（不允许）哪些字符？
What characters are allowed (not allowed) in the names of custom data-* attributes?
我正在开发一个用于视网膜图像服务的 JS 插件。标识这些图像的属性应该如下所示：
data-retina@2x,
data-retina@1.5x,
data-retina@2.5x.
你能告诉我这些属性是否有效吗？ HTML 和 XHTML?
中的自定义数据-* 属性的名称允许（不允许）哪些字符
请参阅 HTML5 规范的 Before attribute name state 部分：
- U+0009 CHARACTER TABULATION (tab)
- U+000A LINE FEED (LF)
- U+000C FORM FEED (FF)
- U+0020 SPACE
- Ignore the character.
- U+002F SOLIDUS (/)
Switch to the self-closing start tag state.
- U+003E GREATER-THAN SIGN (>)
Switch to the data state. Emit the current tag token.
Uppercase ASCII letter
- Start a new attribute in the current tag token. Set that attribute's name to the lowercase version of the current input character (add 0x0020 to the character's code point), and its value to the empty string. Switch to the attribute name state.
- U+0000 NULL
- Parse error. Start a new attribute in the current tag token. Set that attribute's name to a U+FFFD REPLACEMENT CHARACTER character, and its value to the empty string. Switch to the attribute name state.
- U+0022 QUOTATION MARK (")
- U+0027 APOSTROPHE (')
- U+003C LESS-THAN SIGN (<)
- U+003D EQUALS SIGN (=)
- Parse error. Treat it as per the "anything else" entry below.
- EOF
Parse error. Switch to the data state. Reconsume the EOF character.
- Anything else
Start a new attribute in the current tag token. Set that attribute's name to the current input character, and its value to the empty string. Switch to the attribute name state.
简单来说：
It says all characters except tab, line feed, form feed, space, solidus, greater than sign, quotation mark, apostrophe and equals sign will be treated as part of the attribute name. Personally, I wouldn't attempt pushing the edge cases of this though.
灵感来自：What characters are allowed in an HTML attribute name?
参见W3C中的definition of the data-* attributeHTML5推荐：
在 HTML5 中，名称必须是 XML-compatible（并且它会自动变为 ASCII 小写）。
在 XHTML5 中，名称必须 XML-compatible 并且不能包含大写 ASCII 字母。
definition of XML-compatible 说
- 不得包含
: 个字符
- 必须匹配
Name 生产 XML 1.0 规范
此 Name production 列出了允许使用的字符。
tl;dr: data-之后的部分可以使用以下字符:
0-9a-zA-Z（不在 XHTML5）- _ . ·以及来自这些 Unicode 范围的字符：
- [#x0300-#x036F] (Combining Diacritical Marks)
- [#x203F-#x2040] (
‿ ⁀)
- [#xC0-#xD6]
- [#xD8-#xF6]
- [#xF8-#x2FF]
- [#x370-#x37D]
- [#x37F-#x1FFF]
- [#x200C-#x200D]（零宽度非连接，零宽度连接）
- [#x2070-#x218F]
- [#x2C00-#x2FEF]
- [#x3001-#xD7FF]
- [#xF900-#xFDCF]
- [#xFDF0-#xFFFD]
- [#x10000-#xEFFFF]
所以 @ (U+0040) 是不允许的。
我正在开发一个用于视网膜图像服务的 JS 插件。标识这些图像的属性应该如下所示：
data-retina@2x,
data-retina@1.5x,
data-retina@2.5x.
你能告诉我这些属性是否有效吗？ HTML 和 XHTML?
中的自定义数据-* 属性的名称允许（不允许）哪些字符请参阅 HTML5 规范的 Before attribute name state 部分：
- U+0009 CHARACTER TABULATION (tab)
- U+000A LINE FEED (LF)
- U+000C FORM FEED (FF)
- U+0020 SPACE
- Ignore the character.
- U+002F SOLIDUS (/)
Switch to the self-closing start tag state.- U+003E GREATER-THAN SIGN (>) Switch to the data state. Emit the current tag token.
Uppercase ASCII letter- Start a new attribute in the current tag token. Set that attribute's name to the lowercase version of the current input character (add 0x0020 to the character's code point), and its value to the empty string. Switch to the attribute name state.
- U+0000 NULL
- Parse error. Start a new attribute in the current tag token. Set that attribute's name to a U+FFFD REPLACEMENT CHARACTER character, and its value to the empty string. Switch to the attribute name state.
- U+0022 QUOTATION MARK (")
- U+0027 APOSTROPHE (')
- U+003C LESS-THAN SIGN (<)
- U+003D EQUALS SIGN (=)
- Parse error. Treat it as per the "anything else" entry below.
- EOF
Parse error. Switch to the data state. Reconsume the EOF character.- Anything else
Start a new attribute in the current tag token. Set that attribute's name to the current input character, and its value to the empty string. Switch to the attribute name state.
简单来说：
It says all characters except tab, line feed, form feed, space, solidus, greater than sign, quotation mark, apostrophe and equals sign will be treated as part of the attribute name. Personally, I wouldn't attempt pushing the edge cases of this though.
灵感来自：What characters are allowed in an HTML attribute name?
参见W3C中的definition of the data-* attributeHTML5推荐：
在 HTML5 中，名称必须是 XML-compatible（并且它会自动变为 ASCII 小写）。
在 XHTML5 中，名称必须 XML-compatible 并且不能包含大写 ASCII 字母。
definition of XML-compatible 说
- 不得包含
:个字符 - 必须匹配
Name生产 XML 1.0 规范
此 Name production 列出了允许使用的字符。
tl;dr: data-之后的部分可以使用以下字符:
0-9a-zA-Z（不在 XHTML5）-_.·以及来自这些 Unicode 范围的字符：
- [#x0300-#x036F] (Combining Diacritical Marks)
- [#x203F-#x2040] (
‿⁀) - [#xC0-#xD6]
- [#xD8-#xF6]
- [#xF8-#x2FF]
- [#x370-#x37D]
- [#x37F-#x1FFF]
- [#x200C-#x200D]（零宽度非连接，零宽度连接）
- [#x2070-#x218F]
- [#x2C00-#x2FEF]
- [#x3001-#xD7FF]
- [#xF900-#xFDCF]
- [#xFDF0-#xFFFD]
- [#x10000-#xEFFFF]
所以 @ (U+0040) 是不允许的。