CODEWITHSUNDEEP
jquerycssjquery-selectorscss-selectors
Sparky
Sparky

Reputation: 98728

Attribute selectors with or without quotes?

Does it matter which way the following selector is written? It validates both ways and the W3C spec seems silent on the issue of quotation marks.

Option 1:

input[type=text]

Option 2:

input[type='text']

I've seen selectors that work both with and without quotes. Do both ways always work for either CSS or jQuery?

So, is using the quotation marks simply a matter of preference? Semantics? CSS version?

Do we have two methods because of backward compatibility? If so, which way is best going forward?

Despite the accepted answer to this other SO question, I'm thinking quotes is best:

input[type='text']

Upvotes: 2

Views: 250

Answers (3)

jfriend00
jfriend00

Reputation: 707308

I'd sum it up this way:

  • For some sequences of characters (legal identifiers), you don't need quotes.
  • For all other sequences of characters (like anything that starts with a number), you must use quotes.
  • If you KNOW what constitutes a legal CSS identifier and that's what you have, you can leave off the quotes.
  • If you KNOW that what you have is not an identifier, you must put in the quotes.
  • If you don't want to think about it and want to do it consistently all the time, use the quotes.

For [type=text], you can leave off the quotes if you want to because text is a legal CSS identifier.

I personally prefer consistency and not having to think about it and less of a chance of making a mistake so I always put in the quotes.

Upvotes: 6

Dennis
Dennis

Reputation: 32598

According to the CSS spec (versions 2 and 3):

Attribute values must be identifiers or strings.

Strings are double-quoted or single-quoted, [type="text"], while identifiers, [type=text], are defined this way:

In CSS, identifiers (including element names, classes, and IDs in selectors) can contain only the characters [a-zA-Z0-9] and ISO 10646 characters U+00A0 and higher, plus the hyphen (-) and the underscore (_); they cannot start with a digit, two hyphens, or a hyphen followed by a digit. Identifiers can also contain escaped characters and any ISO 10646 character as a numeric code (see next item). For instance, the identifier "B&W?" may be written as "B\&W\?" or "B\26 W\3F".

Simply put, either way goes and it's a matter of preference. The advantage of strings (i.e. quoting your attribute values) is for consistency; every value can be represented as a string, but not everything can be represented as an identifier. You can run values through this page to check on whether or not you need quotes.

Upvotes: 5

Jimmy Miller
Jimmy Miller

Reputation: 1319

I would use input[type='text'] going forward.

Upvotes: 1

Related Questions