27、Selenium + Python 实现 UI 自动化测试-调用 JavaScript 修改元素属性

最新推荐文章于 2024-10-12 11:29:55 发布

Storm啊

最新推荐文章于 2024-10-12 11:29:55 发布

阅读量2.9k

点赞数

CC 4.0 BY-SA版权

分类专栏： Selenium + Python

本文链接：https://blog.csdn.net/duzilonglove/article/details/78273546

Selenium + Python 专栏收录该内容

50 篇文章

订阅专栏

本文介绍了如何使用Selenium和JavaScript来操作带有readonly属性的HTML元素，包括删除属性使元素可编辑，以及通过设置属性值来模拟用户选择行为。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

前面在讲 Selenium 操作日期时间控件的时候，遇到过这样的问题：某些时候日期时间框有个readonly 属性，不允许直接输入，当时解决的办法是，删除掉这个属性，然后再输入。结合我们之前学的 JavaScript 可以操作HTML 元素属性的知识，今天再回头看一下。

1、实例1：删除属性值，使只读元素可以输入

内容请参考：http://blog.csdn.net/duzilonglove/article/details/78246903

2、实例2：删除属性，允许输入

我们手写了一个html，如下

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Storm</title>
</head>
<body>
    <p id="p1" >这里有不可输入的输入框</p>
    <input style="text" id="input" readonly>
</body>
</html>

打开页面，尝试在输入框内写入内容，发现不可输入：

尝试用Selenium 输入内容：

from selenium import webdriver
import time

driver = webdriver.Chrome()
driver.get("file:///e:/python/test1/day2/test1.html")
driver.find_element_by_id('input').send_keys('aaa')
time.sleep(4)
driver.quit()

虽然没有报错，但是内容并没写入到文本框。

改进，删除掉readonly属性

from selenium import webdriver
import time

driver = webdriver.Chrome()
driver.get("file:///e:/python/test1/day2/test1.html")

js2 = "document.getElementById('input').removeAttribute('readonly')"
driver.execute_script(js2)

driver.find_element_by_id('input').send_keys('aaa')
time.sleep(4)
driver.quit()

运行成功，成功输入内容

3、使不可见元素变为可见元素

示例暂缺

4、点击元素（某些场景下元素点击无效，使用js 实现点击效果）

效果如下：

ele = driver.find_element_by_id('reg_butt')
js1 = "arguments[0].click()"
driver.execute_script(js1,ele)

测试场景没找到，示例暂缺

5、示例5：

项目中遇到这样一个场景

点击弹框选择会诊医生，由于弹框比较难操作，所以打算直接sendkeys，医生名字，发现并不成功

手动选择某个医生，然后对比下该元素哪个属性变化了

发现input 元素并没有属性变化，value值还是空。但是仔细看，他上面的兄弟节点，input 的value属性多了一个数值。好的，大概就是这个意思了。

js1 = "document.getElementById('eid').setAttribute('value','3240383');"
driver.execute_script(js1)

经试验，成功实现了选择某个医生的效果。