TR元素内的单击复选框

Question

我想根据用户电子邮件选择复选框。我尝试这样的操作，但不起作用：“ InvalidStateError：调试器eval代码抛出异常：1”。

$x("//span[text()='[email protected]']/parent::div/previousElementSibling::td");

我在做什么错？谢谢！

    <td class="col checkUser selection">
        <div class="checkbox um-checkbox">
            <input type="checkbox" value="option1">
            <label data-select-checkbox="" data-ngretain="u-cd324c08-f215-5784-87b7-98944b18819f"></label>
        </div>
    </td>
    <td class="col userData item-collapse item-top">
        <div class="showUserDetails" title="My User" data-id="u-cd324c08-f215-5784-87b7-98944b18819f">
            <span class="text-overflow " style="max-width: 90%;display: inline-block;">
            <span class="first-name">My </span>
            <span class="first-name">User </span>
            </span>
            <span>
        <a href="#" class="hide" style="display: inline-block;"><img style="height: 24px;width:24px;margin-left: 5px;" src="/Admin/img/admin-gray.svg"></a>
        </span>
        </div>
    </td>
    <td class="col userData item-collapse item-top">
        <div class="showUserDetails text-overflow" title="[email protected]" data-id="u-cd324c08-f215-5784-87b7-98944b18819f">
            <span class="first-name">[email protected] </span>
        </div>
    </td>

Answer 1

previousElementSibling不是XPath选择器，而是元素上的属性：https://developer.mozilla.org/en-US/docs/Web/API/NonDocumentTypeChildNode/previousElementSibling

XPath的几乎相似的选择器是preceding-sibling选择器。但这将返回前面的所有同级，因此您必须使用[1]选择器将结果最大化为1：

/preceding-sibling::div[1]

然后，您仍然只需要选择包含复选框类的div，因此您将需要[contains(@class, 'checkbox')]选择器并使用/input选择器选择输入。

复选框的完整选择器如下所示：

$x("//span[text()='[email protected]']/parent::div/preceding-sibling::div[contains(@class, 'checkbox')][1]/input")