二十、附录 C：标记 selectors 语法

Thymeleaf 的标记 selectors 直接从 Thymeleaf 的解析库AttoParser借用。

该 selectors 的语法与 XPath，CSS 和 jQuery 中的 selectors 的语法有很大相似之处，这使它们对于大多数用户而言易于使用。您可以在AttoParser documentation上查看完整的语法参考。

例如，以下 selectors 将在标记内的每个位置选择类别为content的每个<div>(请注意，这样做并不那么简洁，请 continue 阅读以了解原因)：

<div th:insert="mytemplate :: //div[@class='content']">...</div>

基本语法包括：

• /x表示名称为 x 的当前节点的直接子代。
• //x表示任意深度的名称为 x 的当前节点的子代。
• x[@z="v"]表示名称为 x 的元素和名为 z 的属性，其值为“ v”。
• x[@z1="v1" and @z2="v2"]表示名称为 x 的元素以及属性 z1 和 z2 的值分别为“ v1”和“ v2”。
• x[i]表示名称 x 位于其同级兄弟中编号 i 的元素。
• x[@z="v"][i]表示元素 x 的名称，属性 z 的值为“ v”，并且在与该条件匹配的同级元素中位于第 i 个位置。

但是也可以使用更简洁的语法：

• x与//x完全等效(在任何深度级别搜索名称或参考x的元素，* reference *为th:ref或th:fragment属性)。
• selectors 也可以不带元素名称/引用，只要它们包含参数说明即可。因此[@class='oneclass']是一个有效的 selectors，它会查找具有值为"oneclass"的 class 属性的任何元素(标签)。

高级属性选择功能：

• 除=(等于)外，其他比较运算符也有效：!=(不等于)，^=(以开头)和$=(以结尾)。例如：x[@class^='section']表示名称为x且属性值class以section开头的元素。
• 既可以以@(XPath 样式)开头，也可以不(jQuery 样式)开头来指定属性。因此x[z='v']等效于x[@z='v']。
• 多属性修饰符既可以与and(XPath 风格)结合，也可以通过链接多个修饰符(jQuery 风格)来结合。因此x[@z1='v1' and @z2='v2']实际上等于x[@z1='v1'][@z2='v2'](也等于x[z1='v1'][z2='v2'])。

直接的类似于 jQuery 的 selectors：

• x.oneclass等效于x[class='oneclass']。
• .oneclass等效于[class='oneclass']。
• x#oneid等效于x[id='oneid']。
• #oneid等效于[id='oneid']。
• x%oneref表示具有th:ref="oneref"或th:fragment="oneref"属性的<x>个标记。
• %oneref表示所有具有th:ref="oneref"或th:fragment="oneref"属性的标签。注意，这实际上等效于oneref，因为可以使用引用代替元素名称。
• 直接 selectors 和属性 selectors 可以混合使用：a.external[@href^='https']。

因此，上面的标记 selectors 表达式：

<div th:insert="mytemplate :: //div[@class='content']">...</div>

可以写成：

<div th:insert="mytemplate :: div.content">...</div>

检查另一个示例，这是：

<div th:replace="mytemplate :: myfrag">...</div>

将寻找th:fragment="myfrag"片段签名(或th:ref引用)。但是还会查找名称为myfrag的标签(如果存在)(在 HTML 中不存在)。注意与以下内容的区别：

<div th:replace="mytemplate :: .myfrag">...</div>

…实际上将查找带有class="myfrag"的任何元素，而无需关心th:fragment签名(或th:ref引用)。

多值类匹配

标记 selectors 将 class 属性理解为 multivalued ，因此即使元素具有多个 class 值，也允许在该属性上应用 selectors。

例如，div.two将匹配<div class="one two three" />