如何选择伪元素并从 :: after a :: before 更改状态？

Question

我有这段代码 html e CSS：

[type=checkbox]:checked+label:before, [type=checkbox]:not(:checked)+label:before, [type=radio]:checked+label:before, [type=radio]:not(:checked)+label:before {
    content: '';
    left: 0;
    margin-top: 5px;
    width: 7px;
    height: 7px;
    border: 1px solid #000;
    border-radius: 100%;
    background: #fff;
    display: inline-block;
    margin-right: 16px;
    float: left;
}


[type=checkbox]:checked+label:after, [type=checkbox]:not(:checked)+label:after, [type=radio]:checked+label:after, [type=radio]:not(:checked)+label:after {
    content: '';
    width: 9px;
    height: 9px;
    background: #000;
    position: absolute;
    top: 5px;
    left: 0;
    border-radius: 100%;
    -webkit-transition: all .2s ease;
    transition: all .2s ease;
}

<label class="checkbox subfield" for="gdpr_21215">
::before
Privacy Policy 
::after
</label>
<input type="checkbox" id="gdpr_26839" name="gdpr[26839]" value="Y" class="av-checkbox gdpr subscribe-newsletter">

我正在使用 selenium 和 python 来点击，但它不起作用我用这个：

driver.find_element_by_css_selector("input[value='Y'][id='gdpr_21215'][name='gdpr[21215]']").click

我读到必须使用javascript来模拟但我不明白如何

Answer 1

您可以尝试使用 Javascript click 来单击所需的元素并解决ElementNotInteractable 异常：

from selenium.webdriver.common.by import By
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC


# first invoke WebDriverWait and wait for the element to exist
checkbox = WebDriverWait(driver, 10).until(
        EC.presence_of_element_located((By.ID, "gdpr_26839")))

# use Javascript to click checkbox
driver.execute_script("arguments[0].click();", checkbox)

如果这不起作用，您可能需要修改选择器方法By.ID, "gdpr_26839"。 By.XPATH, //input[contains(@id, 'gdpr')] 之类的东西可能效果更好，具体取决于 gdpr_26839 是否是唯一/动态生成的 ID。