久久久久久久av_日韩在线中文_看一级毛片视频_日本精品二区_成人深夜福利视频_武道仙尊动漫在线观看

屬性選擇器中的空格規則是什么?

What are the rules around whitespace in attribute selectors?(屬性選擇器中的空格規則是什么?)
本文介紹了屬性選擇器中的空格規則是什么?的處理方法,對大家解決問題具有一定的參考價值,需要的朋友們下面隨著小編來一起學習吧!

問題描述

我正在閱讀關于 屬性選擇器的規范,但是如果允許空格,我找不到任何說明.我猜它在開頭,操作員之前和之后以及最后都是允許的.這是正確的嗎?

I'm reading the spec on attribute selectors, but I can't find anything that says if whitespace is allowed. I'm guessing it's allowed at the beginning, before and after the operator, and at the end. Is this correct?

推薦答案

屬性選擇器中的空格規則在語法中有說明.這是屬性選擇器的 Selectors 3 產生式(一些標記替換為它們的字符串用于說明的等價物;S* 表示 0 個或多個空白字符):

The rules on whitespace in attribute selectors are stated in the grammar. Here's the Selectors 3 production for attribute selectors (some tokens substituted with their string equivalents for illustration; S* represents 0 or more whitespace characters):

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

當然,對于希望了解如何編寫屬性選擇器的人來說,語法并不是非常有用,因為它是為實現選擇器引擎的人準備的.

Of course, the grammar isn't terribly useful to someone looking to understand how to write attribute selectors, as it's intended for someone who's implementing a selector engine.

這是一個簡單的英文解釋:

Here's a plain-English explanation:

這在上面的產生式中沒有涉及,但第一個明顯的規則是,如果你將一個屬性選擇器附加到另一個簡單的選擇器或偽元素上,不要使用空間:

This isn't covered in the above production, but the first obvious rule is that if you're attaching an attribute selector to another simple selector or a pseudo-element, don't use a space:

a[href]::after

如果這樣做,則該空間將被視為 后代組合符 相反,屬性選擇器和任何可能跟隨它的東西都隱含了通用選擇器.也就是說,這些選擇器是等價的,但與上面的不同:

If you do, the space is treated as a descendant combinator instead, with the universal selector implied on the attribute selector and anything that may follow it. In other words, these selectors are equivalent to each other, but different from the above:

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

屬性選擇器內的空格

括號內和比較運算符周圍是否有空格無關緊要;我發現瀏覽器似乎將它們視為不存在(但我尚未進行廣泛測試).根據語法,這些都是有效的,據我所知,它們適用于所有現代瀏覽器:

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

^(或其他符號)和 = 之間不允許有空格,因為它們被視為單個標記,并且標記不能分開.

Whitespace is not allowed between the ^ (or other symbol) and = as these are treated as a single token, and tokens cannot be broken apart.

如果 IE7 和 IE8 正確地實現了語法,它們應該也能處理它們.

If IE7 and IE8 implement the grammar correctly, they should be able to handle them all as well.

如果使用 命名空間前綴,則不允許在前綴和屬性名稱.

If a namespace prefix is used, whitespace is not allowed between the prefix and the attribute name.

這些都不正確:

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

這些是正確的:

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

屬性值中的空格

但請注意上面屬性值的引號;如果您將它們排除在外,并嘗試選擇其屬性值中包含空格的內容,則會出現語法錯誤.

Whitespace within the attribute value

But notice the quotes around the attribute values above; if you leave them out, and you try to select something whose attribute has spaces in its value you have a syntax error.

這是不正確的:

div[class=one two]

這是正確的:

div[class="one two"]

這是因為不帶引號的屬性值被視為標識符,不包括空格(出于顯而易見的原因),而帶引號的值被視為字符串.有關詳細信息,請參閱本規范.

This is because an unquoted attribute value is treated as an identifier, which doesn't include whitespace (for obvious reasons), whereas a quoted value is treated as a string. See this spec for more details.

為防止此類錯誤,我強烈建議始終引用屬性值,無論是 HTML、XHTML(必需)、XML(必需)、CSS 還是 jQuery(需要一次).

To prevent such errors, I strongly recommend always quoting attribute values, whether in HTML, XHTML (required), XML (required), CSS or jQuery (once required).

從選擇器 4 開始(在此答案的原始發布之后),屬性選擇器可以接受出現在屬性值之后的標識符形式的標志.定義了兩個與 字符大小寫有關的標志,一個用于不區分大小寫匹配:

As of Selectors 4 (following the original publication of this answer), attribute selectors can accept flags in the form of an identifier appearing after the attribute value. Two flags have been defined pertaining to character case, one for case-insensitive matching:

div[data-foo="bar" i]

還有一個用于區分大小寫的匹配(其添加 我參與了,盡管是 WHATWG 的代理):

And one for case-sensitive matching (whose addition I had a part in, albeit by proxy of the WHATWG):

ol[type="A" s]
ol[type="a" s]

語法已更新因此:

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 和右括號之間的空格一如既往是可選的.

In plain English: if the attribute value is not quoted (i.e. it is an identifier), whitespace between it and attrib_flags is required; otherwise, if the attribute value is quoted then whitespace is optional, but strongly recommended for the sake of readability. Whitespace between attrib_flags and the closing bracket is optional as always.

這篇關于屬性選擇器中的空格規則是什么?的文章就介紹到這了,希望我們推薦的答案對大家有所幫助,也希望大家多多支持html5模板網!

【網站聲明】本站部分內容來源于互聯網,旨在幫助大家更快的解決問題,如果有圖片或者內容侵犯了您的權益,請聯系我們刪除處理,感謝您的支持!

相關文檔推薦

Style every third element?(每隔三個元素設置樣式?)
Why shouldn#39;t I use ID selectors in CSS?(為什么我不應該在 CSS 中使用 ID 選擇器?)
What does img[class*=quot;alignquot;] mean in CSS?(CSS 中的 img[class*=“align] 是什么意思?)
CSS: Last element on line(CSS:最后一個元素)
How do I select every other div class element using just CSS (no js)(如何僅使用 CSS(無 js)選擇所有其他 div 類元素)
Tool for checking unused CSS selectors?(檢查未使用的 CSS 選擇器的工具?)
主站蜘蛛池模板: www.爱爱| 日韩毛片网站 | 日韩精品一二区 | 一级免费看 | av在线播放观看 | 国产精品黄色 | 亚洲国产成人精品久久 | 久久er99热精品一区二区 | 日韩黄网| 久久久久久久 | 中国一级黄色录像 | 亚洲免费黄色 | 青青草国产成人av片免费 | 狠狠操天天操 | www.色中色 | 国产一级免费视频 | 国产欧美综合一区二区三区 | 日韩 国产 欧美 | 成年人免费看视频 | 国产精品成人在线 | 成人亚洲天堂 | 亚洲精品免费在线 | 久久精品国产一区二区 | 一本一道久久a久久精品蜜桃 | 欧美一区二区免费 | 97国产视频| 国产午夜三级 | 日韩欧美亚洲国产 | 亚洲毛片在线 | 欧美精品区 | 综合久久久久 | 国产一区二区影院 | 亚洲精品欧美 | 91久久在线| 日韩一区不卡 | 性av在线 | 青草网| 日韩免费成人 | 国产日韩视频 | 视色av| 日韩少妇av |