Question

我正在阅读attribute selectors上的规范，但我找不到任何说明是否允许空格的内容。我猜测它在开始时，操作员之前和之后以及最后都是允许的。这是对的吗？

Answer 1

属性选择器中的空格规则在语法中说明。以下是属性选择器的Selectors 3生成（一些标记用其等效字符替换为插图; S*表示0或更多空白字符）：

attrib
  : '[' S* [ namespace_prefix ]? IDENT S*
        [ [ '^=' |
            '$=' |
            '*=' |
            '=' |
            '~=' |
            '|=' ] S* [ IDENT | STRING ] S*
        ]? ']'
  ;

当然，对于想要了解如何编写属性选择器的人来说，语法并不是非常有用，因为它适用于那些实现选择器引擎的人。 / p>

这是一个简单的英文解释：

属性选择器

之前的空格

上面的产品没有涉及到这一点，但第一个明显的规则是，如果您将属性选择器附加到另一个简单选择器或伪元素，不要使用空间：

a[href]::after

如果这样做，则该空格将被视为descendant combinator，而通用选择器隐含在属性选择器上以及可能跟随它的任何内容。换句话说，这些选择器彼此相同，但与上述不同：

a [href] ::after
a *[href] *::after

属性选择器

内的空格

括号内和比较运算符周围是否有任何空格无关紧要;我发现浏览器似乎把它们视为不存在（但我没有进行过广泛的测试）。这些都是根据语法有效的，据我所见，在所有现代浏览器中都可以使用：

a[href]
a[ href ]
a[ href="http://stackoverflow.com" ]
a[href ^= "http://"]
a[ href ^= "http://" ]

（显然，用空格打破^和=是不正确的。）

如果IE7和IE8正确实现了语法，他们也应该能够处理它们。

如果使用namespace prefix，则前缀和属性名称之间不允许有空格。

这些不正确：

unit[sh| quantity]
unit[ sh| quantity="200" ]
unit[sh| quantity = "200"]

这些都是正确的：

unit[sh|quantity]
unit[ sh|quantity="200" ]
unit[sh|quantity = "200"]

属性值

中的空格

但请注意上面属性值的引号;如果你将它们遗漏，并且你试图选择其属性在其值中有空格的东西，则会出现语法错误。

这是不正确的：

div[class=one two]

这是正确的：

div[class="one two"]

这是因为不带引号的属性值被视为标识符，它不包括空格（出于显而易见的原因），而引用的值被视为字符串。有关详细信息，请参阅this spec。

为防止出现此类错误，我强烈建议您始终引用属性值，无论是HTML，XHTML（必需），XML（必需），CSS还是jQuery（once required）。

属性值

之后的空格

从选择器4开始，属性选择器可以接受在属性值之后出现的标识符形式的标志。到目前为止，已经为case-sensitivity定义了一个标志（或者更确切地说，case- 不敏感）：

div[data-foo="bar" i]

因此语法为updated：

attrib
  : '[' S* attrib_name ']'
    | '[' S* attrib_name attrib_match [ IDENT | STRING ] S* attrib_flags? ']'
  ;

attrib_name
  : wqname_prefix? IDENT S*

attrib_match
  : [ '=' |
      PREFIX-MATCH |
      SUFFIX-MATCH |
      SUBSTRING-MATCH |
      INCLUDE-MATCH |
      DASH-MATCH
    ] S*

attrib_flags
  : IDENT S*

用简单的英语：如果没有引用属性值（即它是一个标识符），则需要它与attrib_flags之间的空格;否则，如果引用属性值，则空格是可选的，但强烈建议为了便于阅读。 attrib_flags和结束括号之间的空格始终是可选的。

围绕属性选择器中的空格有哪些规则？

1 个答案:

属性选择器

属性选择器

属性值

属性值