如何使用Selenium执行JavaScript代码？

Selenium 的 execute_script 方法允许在浏览器上下文中执行 JavaScript 代码。这对于执行一些 WebDriver 本身不提供的操作非常有用，比如直接操作 DOM 元素、执行一些特定的 JavaScript 功能等。这个方法的一般语法是：

driver.execute_script(script, *args)

这个方法的返回值取决于执行的 JavaScript 代码。通常情况下，如果 JavaScript 代码返回一个值，那么 execute_script 方法也会返回这个值。

from selenium import webdriver

driver = webdriver.Chrome()
driver.get("https://example.com")

# 使用execute_script方法执行JavaScript代码并传递参数
result = driver.execute_script("function add(a, b) { return a + b; }", 2, 3)

print(result)  # 输出结果为 5

driver.quit()

在这个例子中，我们将JavaScript代码作为execute_script方法的第一个参数传递，并将要传递的参数（2和3）作为第二个参数传递。JavaScript代码将在浏览器上下文中执行，并且arguments对象将包含传递的参数（在这个例子中是2和3）。 

可以将其功能大致分类如下：

   – 通过 ID 查找元素
   – 通过类名查找元素
   – 通过标签名查找元素
   – 通过 CSS 选择器查找元素
   – 设置元素文本内容
   – 设置元素值（适用于输入框等）
   – 设置元素样式
   – 点击元素
   – 触发事件
   – 模拟键盘按键

from selenium import webdriver

driver = webdriver.Chrome()

# 示例：通过 ID 查找元素并设置文本内容
driver.get("https://example.com")
element = driver.execute_script("return document.getElementById('element_id')")
driver.execute_script("arguments[0].textContent = 'New text'", element)

# 示例：点击元素
driver.execute_script("arguments[0].click()", element)

# 示例：触发事件
driver.execute_script("arguments[0].dispatchEvent(new Event('click'))", element)

# 示例：模拟键盘按键
driver.execute_script("arguments[0].dispatchEvent(new KeyboardEvent('keydown', {key: 'Enter'}))", element)

driver.quit()

arguments对象在Selenium的execute_script方法中表示传递给JavaScript代码的参数。通过将参数作为execute_script方法的第二个参数传递，您可以在JavaScript代码中访问这些参数，并在浏览器上下文中执行自定义操作。 

from selenium import webdriver

driver = webdriver.Chrome()
driver.get("https://example.com")

# 使用execute_script方法获取特定DOM元素的文本内容
text = driver.execute_script("return arguments[0].textContent", driver.find_element_by_tag_name("h1"))
print(text)

driver.quit()

 在这个例子中，我们使用execute_script方法来获取页面上的h1元素的文本内容。我们首先使用find_element_by_tag_name方法找到h1元素，然后将其作为execute_script方法的第一个参数传递。JavaScript代码"return arguments[0].textContent"将返回h1元素的文本内容，我们可以从返回值中获取这个值。

   – 滚动到指定位置
   – 滚动到元素可见

# 示例：滚动到指定位置
driver.execute_script("window.scrollTo(0, 500)")

# 示例：滚动到元素可见
driver.execute_script("arguments[0].scrollIntoView(true);", element)

driver.execute_script("window.scrollTo(0, document.body.scrollHeight);")

3. **表单操作**：
   – 提交表单
   – 重置表单

# 示例：提交表单
form_element = driver.execute_script("return document.getElementById('form_id')")
driver.execute_script("arguments[0].submit()", form_element)

# 示例：重置表单
driver.execute_script("arguments[0].reset()", form_element)

   – 设置浏览器标题
   – 弹出提示框
   – 刷新页面

title = driver.execute_script("return document.title;")
print("页面标题：", title)

from selenium import webdriver
import time
# 创建 WebDriver 实例（如 Chrome WebDriver）
driver = webdriver.Chrome()

# 打开网页
driver.get("https://www.example.com")

# 触发一个警告框（alert、confirm 或 prompt）
driver.execute_script("alert('This is an alert message.')")

# switch_to.alert 方法是 Selenium 中用于处理浏览器中出现的警告框（alert、confirm 和 prompt）的方法。
# 它的作用是将 WebDriver 的控制权切换到警告框上，以便进行相应的操作。

# 切换到警告框
alert = driver.switch_to.alert
time.sleep(4)
# 对警告框进行操作，例如获取文本和点击确认按钮
alert_text = alert.text  # 获取警告框的文本
print("Alert Text:", alert_text)

alert.accept()  # 点击确认按钮

# 关闭浏览器
driver.quit()

# 示例：设置浏览器标题
driver.execute_script("document.title = 'New Title'")

# 示例：刷新页面
driver.execute_script("location.reload()")

5. **Cookie 和存储操作**：
   – 设置 Cookie
   – 获取 Cookie
   – 存储数据到 localStorage/sessionStorage
   – 获取 localStorage/sessionStorage 数据

# 示例：设置 Cookie
driver.execute_script("document.cookie = 'name=value; expires=date; path=path'")

# 示例：获取 Cookie
cookies = driver.execute_script("return document.cookie")

# 示例：存储数据到 localStorage
driver.execute_script("localStorage.setItem('key', 'value')")

# 示例：获取 localStorage 数据
data = driver.execute_script("return localStorage.getItem('key')")

6. **其他操作**：
   – 添加/移除类名
   – 获取/设置属性值
   – 延迟执行函数

# 示例：添加类名
driver.execute_script("arguments[0].classList.add('new-class')", element)

# 示例：获取属性值
attribute_value = driver.execute_script("return arguments[0].getAttribute('attribute_name')", element)

# 示例：创建新元素并添加到文档
new_element = driver.execute_script("return document.createElement('div')")
driver.execute_script("document.body.appendChild(arguments[0])", new_element)

# 示例：延迟执行函数
driver.execute_script("setTimeout(function(){ /* 操作 */ }, 2000)")

7. **页面元素操作**：
   – 插入行到表格
   – 插入单元格到行
   – 创建新元素并添加到文档

# 示例：插入行到表格
table = driver.execute_script("return document.getElementById('table_id')")
driver.execute_script("table.insertRow(index)")

# 示例：插入单元格到行
row = driver.execute_script("return document.getElementById('row_id')")
driver.execute_script("row.insertCell(index)")

# 示例：创建新元素并添加到文档
new_element = driver.execute_script("return document.createElement('div')")
driver.execute_script("document.body.appendChild(arguments[0])", new_element)

8. **对话框处理**：
   – 弹出警告框
   – 更改 confirm 对话框返回值

# 示例：弹出警告框
driver.execute_script("alert('Hello, this is an alert!')")

# 示例：更改 confirm 对话框返回值
driver.execute_script("window.confirm = function(){return true;}")

9. **页面交互**：
   – 添加事件监听器
   – 触发自定义事件

# 示例：添加事件监听器
driver.execute_script("arguments[0].addEventListener('click', function(){ /* 处理函数 */ })", element)

# 示例：触发自定义事件
driver.execute_script("arguments[0].dispatchEvent(new Event('customEvent'))", element)

10. **样式操作**：
   – 更改背景颜色
   – 显示/隐藏元素

# 示例：更改背景颜色
driver.execute_script("arguments[0].style.backgroundColor = 'yellow'", element)

# 示例：显示/隐藏元素
driver.execute_script("arguments[0].style.display = 'none'", element)

————
 

execute_script 方法在 Selenium 中是一个非常有用的工具，它允许你直接在浏览器中执行自定义的 JavaScript 代码，从而实现与页面更深入的交互和操作。通过这个方法，你可以执行各种自定义的 JavaScript 功能，例如：

1. 操作 DOM 元素： 可以通过 JavaScript 修改、添加或删除页面上的元素，改变其样式、属性或内容。
2. 模拟用户行为： 可以模拟用户的点击、输入、滚动等操作，例如触发事件、执行动作等。
3. 页面滚动： 可以通过 JavaScript 控制页面的滚动，实现滚动到指定位置、滚动到元素可见等功能。
4. 获取页面信息： 可以通过 JavaScript 获取页面的各种信息，例如页面标题、URL、元素属性、页面加载状态等。
5. 执行复杂操作： 可以执行一些比较复杂的操作，例如执行自定义的 JavaScript 函数、调用第三方 JavaScript 库等。

通过 execute_script 方法，利用 JavaScript 的强大功能与页面进行更深入的交互，完成一些 Selenium 本身无法直接实现的功能，从而更灵活地进行 Web 自动化测试或数据抓取任务。

作者：铁松溜达py