如何获取HTML中无value属性的输入框文本？常规方法失效

问题背景 #

目标元素是Angular框架下的input输入框，HTML代码如下：

<input _ngcontent-ng-c1977743502="" formcontrolname="ip" name="ip" pinputtext="" type="text" class="p-inputtext p-component p-element p-inputtext-sm w-full ng-untouched ng-pristine p-filled ng-valid">

尝试使用get_attribute("value")、get_property("value")、text属性均无法获取输入框文本。

排查与解决办法 #

1. 确认元素定位准确性

先验证定位的元素是否为目标输入框，避免定位错误导致取值失败：

ip_input = CustomerEditPage.proxy_ip(self)
# 打印元素name属性，确认是否为目标元素
print(ip_input.get_attribute('name'))  # 正常应输出"ip"

2. 等待页面完全加载（显式等待）

Angular表单控件初始化存在延迟，需等待元素处于可交互状态后再取值：

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

# 这里以name属性定位为例，可替换为你实际的定位方式
ip_input = WebDriverWait(self.driver, 10).until(
    EC.element_to_be_clickable((By.NAME, "ip"))
)

3. 用JavaScript直接读取DOM值

Selenium的get_attribute可能受Angular变化检测机制影响，直接执行JS读取输入框值更可靠：

ip_value = self.driver.execute_script("return arguments[0].value;", ip_input)

4. 读取Angular FormControl绑定值

由于输入框使用formcontrolname绑定，值可能存储在Angular表单控件实例中，而非DOM属性，可通过JS直接获取：

ip_value = self.driver.execute_script("""
    const ngElement = angular.element(arguments[0]);
    const formCtrl = ngElement.controller('form')?.controls['ip'];
    return formCtrl ? formCtrl.value : null;
""", ip_input)

5. 检查元素状态

元素class包含ng-pristine，说明输入框尚未被修改。若为页面渲染的默认值，可等待Angular完成数据同步，或模拟点击输入框触发变化检测后再取值。

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