3

Attribute class and id names can have any value for the HTML syntax (https://www.w3.org/TR/html51/dom.html#classes), while instead for the CSS syntax they can not start for example with a number (https://www.w3.org/TR/CSS2/syndata.html#characters): why?

What is the reason for this (uncomfortable) difference between two syntaxes that are daughters of the same "father" (w3c)?

I saw (https://stackoverflow.com/a/79022/7208844) that the limitation probably depends by a (regex) rule: I do not understand the reason for this rule, since the syntax the html4 managed to do without it (so I suppose that is not a insurmountable physical limit but perhaps unconventional)

$(".1abc").click(function(){
  alert("OK with number too");
});
$(".abc").click(function(){
  alert("OK");
});
.1abc {
  border: 1px solid black;
}

.abc {
  border: 1px solid black;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="1abc">number</div>
<div class="abc">no number</div>
Community
  • 1
  • 1
Juri
  • 311
  • 4
  • 12
  • 1
    A class needs to be descriptive just having a number does not say what it is – Andrew Jan 11 '17 at 14:55
  • 1
    Perhaps it's because the HTML language is not regular. – barak manos Jan 11 '17 at 14:55
  • 1
    Because it conflicts with the syntax for numbers, for example `.1` is a valid CSS number. The standard tries to simplify the job of the lexer/parser by introducing this restriction. – Ionuț G. Stan Jan 11 '17 at 14:59
  • 1
    @Andrew, thanks, but I don't understand why `class="abc1"` is more descriptive than `class="1abc"`. – Juri Jan 11 '17 at 15:19
  • 1
    @Ionuț, thanks, I saw that jQuery works if `class` name starts whit number BUT has 2 letters or more: it seems to me a reasonable rule that the CSS syntax may adopt. – Juri Jan 11 '17 at 15:23
  • 1
    @ barak, thanks, but I would like the CSS syntax did not have that restriction (not that the html syntax had that too :-) – Juri Jan 11 '17 at 15:25
  • 1
    @Juri jQuery only has to parse CSS selectors, but no property values, such as numbers, which makes things easier for it. On the other hand, a CSS parser needs to parse numbers and things get a little bit more complicated there. Similarly, it's a common approach in programming languages to forbid variable names to start with a digit and for the same reason. – Ionuț G. Stan Jan 11 '17 at 15:28
  • 1
    @Juri just to clarify a bit, it's no that it would be impossible to support this, it's just that it's convenient to not support it. It simplifies things for a very small loss. – Ionuț G. Stan Jan 11 '17 at 15:47

0 Answers0