XPath：跟随兄弟姐妹后获取下一个

Question

在下面的 HTML 代码中，我需要提取class="list-item-child-label ng-inserted"但仅在我有class="fat-checkbox-checked"

<fat-option class="fat-option>
    <fat-pseudo-checkbox class="fat-pseudo-checkbox ></fat-pseudo-checkbox>
    <span class="fat-option-text">
        <div class="justify-content">
            <div class="align-items">
                <fat-checkbox class="fat-checkbox-checked">
                </fat-checkbox>
                <div></div>
                <div class="list-item-child-label"> TEXT AAA </div>
            </div>
            <div class="list-item-child-label ng-inserted"> TEXT BBB </div>
        </div>
    </span>
</fat-option>
<fat-option class="fat-option>
    <fat-pseudo-checkbox class="fat-pseudo-checkbox ></fat-pseudo-checkbox>
    <span class="fat-option-text">
        <div class="justify-content">
            <div class="align-items">
                <fat-checkbox class="fat-checkbox">
                </fat-checkbox>
                <div></div>
                <div class="list-item-child-label"> TEXT AAA </div>
            </div>
            <div class="list-item-child-label ng-inserted"> TEXT BBB </div>
        </div>
    </span>
</fat-option>

我尝试构建的这些 xpath：

'//div[contains(@class, "list-item-child-label ng-inserted")]/ancestor::span//div//fat-checkbox[contains(@class, "mat-checkbox-checked")]'

'//span//div//fat-checkbox[contains(@class, "fat-checkbox-checked")]/following-sibling::div[2]'

'//span//div//fat-checkbox[contains(@class, "fat-checkbox-checked")]/following-sibling::div[contains(@class, "list-item-child-label ng-inserted")]'

让我只有class="list-item-child-label"

任何人都知道如何构建正确的 xpath 以在不使用 contains(@text) 的情况下使用class="fat-checkbox-checked"获取class="list-item-child-label ng-inserted" ？

Answer 1

尝试在 XPath 下面选择所需的节点

//div[fat-checkbox[@class="fat-checkbox-checked"]]/following-sibling::div[@class="list-item-child-label ng-inserted"]

Answer 2

要定位元素<div class="list-item-child-label ng-inserted">后跟元素<fat-checkbox class="fat-checkbox-checked">您可以使用以下任一xpath ：

//fat-checkbox[@class='fat-checkbox-checked']//following::div[@class='list-item-child-label ng-inserted']