如何在自动添加前缀“.”的XPath中结合括号与当前节点语法

问题背景 #

现有DOM结构如下：

<div class="test-table">
  <div class="ant-collapse ant-collapse-icon-position-start test-table-composer">
    <div class="ant-collapse-item ant-collapse-item-active">
      <div class="ant-collapse-header" role="button" />
      <div class="ant-collapse-content ant-collapse-content-active" >
        <div class="ant-collapse-content-box">
          <div class="ant-collapse ant-collapse-icon-position-start test-table-composer">
            <div class="ant-collapse-item ant-collapse-item-active">
              <div class="ant-collapse-header" role="button" />
              <div class="ant-collapse-content ant-collapse-content-active" >
                <div class="ant-collapse-content-box">
                  <div class="ant-collapse ant-collapse-icon-position-start test-table-composer">
                    <div class="ant-collapse-item">
                      <div class="ant-collapse-header" role="button"/>
                    </div>
                  </div>
                  <div class="test-table-test-group">
                    <div class="ant-collapse ant-collapse-icon-position-start test-table-test-item analyzed incomplete">
                      <div class="ant-collapse-item" id="c2c2c3b6-8b72-11ed-9e2e-0f23ae4a2524">
                        <div class="ant-collapse-header" role="button"/>
                      </div>
                    </div>
                    <div class="ant-collapse ant-collapse-icon-position-start test-table-test-item analyzed incomplete">
                      <div class="ant-collapse-item" id="c2c2c3b7-8b72-11ed-9e2e-8ba095d9d02e">
                        <div class="ant-collapse-header" role="button"/>
                      </div>
                    </div>
                    <div class="ant-collapse ant-collapse-icon-position-start test-table-test-item analyzed incomplete">
                      <div class="ant-collapse-item" id="c6248c66-8b72-11ed-9e2e-0b95f6f4ea18">
                        <div class="ant-collapse-header" role="button"/>
                      </div>
                    </div>
                    <div class="ant-collapse ant-collapse-icon-position-start test-table-test-item analyzed incomplete">
                      <div class="ant-collapse-item" id="c6466c47-8b72-11ed-9e2e-cd2c87901141">
                        <div class="ant-collapse-header" role="button"/>
                      </div>
                    </div>
                    <div class="ant-collapse ant-collapse-icon-position-start test-table-test-item analyzed incomplete">
                      <div class="ant-collapse-item" id="c4c28b5f-8b72-11ed-9e2e-496585fd7ed6">
                        <div class="ant-collapse-header" role="button"/>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
          <div class="test-table-test-group"/>
        </div>
      </div>
    </div>
  </div>
</div>

原XPath表达式为：

(//div[contains(@class, 'test-table-composer')]/div[contains(@class, 'test-table-test-item') or (contains(@class, 'ant-collapse-item') and not(@id))])[%s]

其中[%s]用于插入索引。现有库会自动在XPath开头添加.，导致原表达式无法正常工作，需修改XPath并保留括号以支持嵌套元素全局查找及索引功能。

修改后的XPath #

(.//div[contains(@class, 'test-table-composer')]/div[contains(@class, 'test-table-test-item') or (contains(@class, 'ant-collapse-item') and not(@id))])[%s]

关键说明 #

• 将原表达式的//调整为.//，配合库自动添加的前缀，最终变为.//，表示从当前上下文节点开始递归查找所有后代节点，既保留了原有的全局（相对当前上下文）查找能力，又适配了库的前缀逻辑。
• 外层括号完整保留，确保索引[%s]作用于整个匹配结果集合，满足嵌套元素查找和索引定位的需求。

内容的提问来源于stack exchange，提问作者Loremo