phpjs日历控件技巧_web自动化测试js处理日期控件

下面以12306网站为栗子：

从截图中可以看到是有raadonly的，readonly去掉后我们就可以利用send_keys进入输入数据操作了。

js写不好，我们可以在浏览器Console掌握台下操作，由于有自动补充语句功能过，可以在这边操作完了复制到代码中运行......

我利用了getElementById方法定位的，当然你也可以根据标签选择其他方法：

做完以上这些操作后，我们把浏览器Console中的代码，复制到自动化代码中运行：

import timefrom selenium import webdriverfrom selenium.webdriver.common.keys import Keyswith webdriver.Chrome() as driver: driver.get('https://www.12306.cn/index/') js = 'document.getElementById("train_date").removeAttribute("readonly");' driver.execute_script(js) driver.find_element_by_id("train_date").send_keys(Keys.COMMAND + 'a') time.sleep(1) driver.find_element_by_id("train_date").send_keys(Keys.BACKSPACE) time.sleep(1) driver.find_element_by_id("train_date").send_keys('2021-03-15') print(driver.find_element_by_id("train_date").get_attribute('value')) time.sleep(2)

运行后的结果输出到掌握台上：

/Users/lifeng/python-virtualenv/venv/bin/python3 /Users/lifeng/python-projects/test-python/selenium_script.py设置前：2021-03-13设置后：2021-03-15

把稳：

document.getElementById("train_date").removeAttribute("readonly");末了的" ; " 尽可能加上，实操中创造加了后险些都能成功，输入值也能设置成功；不加会涌现运行成功，但是输入值没有设置成功

可能会有疑问，为什么上述代码中要有全选和退格操作：全选是为了选中输入框中的默认值，用于退格删除操作，便是为了防止输入框中显示两个值：

还有便是利用jQuery的供应的方法去处理：

js = r"$('input[id=train_date]').removeAttr('readonly');" js = r"$('input[id=train_date]').attr('readonly', 'false');"

您可以实操下，但是并不是所有的前端框架都支持含$符号的，不支持的可能会抛出错误：

selenium.common.exceptions.JavascriptException: Message: javascript error: $ is not defined 。

以上总结或许能帮助到你，或许帮助不到你，但还是希望能帮助到你，如有疑问、歧义，评论区留言会及时改动发布，感激！

未完，待续…

一贯都在努力，希望您也是！

标签：34readonly