css - XPATH 或 CSS I 我在 span 标签中有一个复选框列表。我正在尝试选择一个特定的复选框

Question

我在 HTML span 标记中有一个复选框列表。在span标签中，有一个输入标签和一个标签标签。我想单击输入标签中具有标签文本的复选框，例如“允许性别不匹配” 在我的 XPATH 中，我可以到达 label 标签，但我不知道如何向上 1，以便我可以单击输入标签。

我需要一些帮助来获取 XPATH 或 CSS 定位器。

我无法使用 id="gwt-uid-1204"，因为这是一个动态值。当您访问该页面时它会发生变化

我获取标签文本的 XPATH 是:

//div[@id="match_configuration_add_possible_tab_match_rules_fp_flags"]/span/label[contains(text(), "Allow gender mismatch")]

HTML 片段是:

<div id="match_configuration_add_possible_tab_match_rules_fp_flags">
    <div class="gwt-Label matchruleheader">Gender and title flags</div>
    <span class="gwt-CheckBox" style="display: block;">
        <input id="gwt-uid-1204" type="checkbox" value="on" tabindex="0"/>
        <label for="gwt-uid-1204">Gender must be present in both names</label>
    </span>
    <span class="gwt-CheckBox" style="display: block;">
        <input id="gwt-uid-1205" type="checkbox" value="on" tabindex="0"/>
        <label for="gwt-uid-1205">Gender must be consistent in both names</label>
    </span>
    <span class="gwt-CheckBox" style="display: block;">
        <input id="gwt-uid-1206" type="checkbox" value="on" tabindex="0"/>
        <label for="gwt-uid-1206">Allow gender mismatch</label>
    </span>
    <span class="gwt-CheckBox" style="display: block;">
    <span class="gwt-CheckBox" style="display: block;">
    <span class="gwt-CheckBox" style="display: block;">
    -- More checkboxes
</div>

谢谢，里亚兹

Answer 1

你至少有两种可能性:

1) 使用 xpaths ".."向上移动一个元素

//div[@id="match_configuration_add_possible_tab_match_rules_fp_flags"]/span/label[contains(text(), "Allow gender mismatch")]/../input

2) 使用 xpath“preceding-sibling”:

//div[@id="match_configuration_add_possible_tab_match_rules_fp_flags"]/span/label[contains(text(), "Allow gender mismatch")]/preceding-sibling::input

我个人更喜欢第一种方法，因为即使同级元素的顺序发生变化，它仍然有效。使用第二种方法，您始终需要检查 sibling 是“前一个”还是“后一个”(然后您必须使用following-sibling)