应用场景

在自动化中, 能对JS代码进行增、删、改的话，可以帮助我们解决很多问题，

如：修改<a>标签的target属性，让它不打开新的窗口(_blank)，从而不用频繁使用switch_to进行窗口之间的切换。

如：日期的输入框被锁定无法直接输入，需要点开日历控件后，从日历控件上点击日期，这时就可以删除日期控件元素中限制输入的属性（readonly）后直接输入日期。

使用JS修改HTML元素，是在浏览器解析后将其删除或添加，源码不会改变。

基本使用

使用JS定位

JS的定位，可以使用Id \Class(类名)\TagName(标签)来定位元素，两者在使用上有点不同

• 使用ID定位时，定位到的是单个对象
• 使用CLASS和TagName定位的时候，返回的是复数对象（类似于elements的复数定位），使用的时候需要用 [下标] 指定要第几个对象

# 通过ID定位
'document.getElementById("ID值")'

# 通过CLASS定位 ->class有多个值的话用空格格开
'document.getElementsByClassName("Class值")[下标]'

# 通过TagName定位
'document.getElementsByTagName("标签名")[下标]'

# 通过CSS定位 
# 定位百度首页的"地图" ->要注意嵌套的引号要使用 \\ 标记
'document.querySelector("div[id=\\"s-top-left\\"]>a[href=\\"http://map.baidu.com\\"]")

# 使用querySelectorAll的话就变成返回列表就要加上 [下标]

JS进行的操作(⭐)

# 增加属性 并 赋值
'.setAttribute("要增加的属性","要赋的值")'
# 删除属性
'.removeAttribute("属性名")'
# 获得属性的值
'.getAttributte("属性名")'
# 修改属性值
'.属性名="值"'

运行

调用Selenium的方法execute_scripts(定位)在浏览器中执行JavaScript代码(使用引号包裹)。

# 基础使用 删除ID值为'top'的标签,的title属性
'document.getElementById("top").removeAttribute("title")'

# 返回top的文本
'return document.getElementById("top").innerText'

# 执行
driver.execute_script('document.getElementById("top").removeAttribute("title")')

使用selenium的定位方法(⭐)

我们也可以使用arguments对象,在selenium中定位之后再传入JS使用增删改操作

arguments对象包含了函数运行时的所有参数，arguments[0]就是第一个参数.

# 先使用selenium的定位方法
a =driver.find_elements(By.TAG_NAME,'a')[3]

# 再传入使用js操作
driver.execute_script("arguments[0].removeAttribute('属性名')", a)


# 但是不能使用下面的这种形式,会报错
a =driver.find_elements(By.TAG_NAME,'a')
driver.execute_script("arguments[3].removeAttribute('属性名')", a)

以上为个人学习记录,欢迎各位指导补充!