WebDriver提供了execute_script()方法来执行JavaScript方法，格式如 driver.execute_script(script,*args)

执行js一般有两种场景，一是在页面中直接执行js，二是在某个已经定位的元素上执行js

通过js操作页面元素

<!DOCTYPE html>

<html lang="en">

<head>

    <title>webdriver 调用js操作元素</title>

    <meta charset="UTF-8">

    <link href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css"

          rel="stylesheet"/>

    <style>

        .modal-dialog {

            position: absolute;

            top: 0;

            bottom: 0;

            left: 0;

            right: 0;

        }

        .modal-content {

            /*overflow-y: scroll; */

            position: absolute;

            top: 0;

            bottom: 0;

            width: 100%;

        }

        .modal-body {

            overflow-y: scroll;

            position: absolute;

            top: 55px;

            bottom: 65px;

            width: 100%;

        }

        .modal-header .close {

            margin-right: 15px;

        }

        .modal-footer {

            position: absolute;

            width: 100%;

            bottom: 0;

        }

    </style>

</head>

<body>

<h3 class="text-info">webdriver 调用js操作元素</h3>

<div class="row-fluid well">

    <a id="btn1">Button1</a>

    <a id="btn2" class="btn" onclick="alert('Button2 click trigger...');">Button2</a>

</div>

<div class="row-fluid well">

    <input type="text" id="username">

</div>

<!-- Button trigger modal -->

<button type="button" id="btn_myModal" class="btn btn-primary btn-lg "

        data-toggle="modal"

        data-target="#myModal">

    模态框滚动条

</button>

<div class="row-fluid well">

    <ul>

        <li>1</li>

        <li>2</li>

        <li>3</li>

        <li>4</li>

        <li>5</li>

        <li>6</li>

        <li>7</li>

        <li>8</li>

        <li>9</li>

        <li>10</li>

        <li>1</li>

        <li>2</li>

        <li>3</li>

        <li>4</li>

        <li>5</li>

        <li>6</li>

        <li>7</li>

        <li>8</li>

        <li>9</li>

        <li>10</li>

        <li>1</li>

        <li>2</li>

        <li>3</li>

        <li>4</li>

        <li>5</li>

        <li>6</li>

        <li>7</li>

        <li>8</li>

        <li>9</li>

        <li>10</li>

        <li>1</li>

        <li>2</li>

        <li>3</li>

        <li>4</li>

        <li>5</li>

        <li>6</li>

        <li>7</li>

        <li>8</li>

        <li>9</li>

        <li>10</li>

        <li>1</li>

        <li>2</li>

        <li>3</li>

        <li>4</li>

        <li>5</li>

        <li>6</li>

        <li>7</li>

        <li>8</li>

        <li>9</li>

        <li>10</li>

        <li>1</li>

        <li>2</li>

        <li>3</li>

        <li>4</li>

        <li>5</li>

        <li>6</li>

        <li>7</li>

        <li>8</li>

        <li>9</li>

        <li>10</li>

    </ul>

</div>

<!-- Modal -->

<div class="modal fade myModal" id="myModal" tabindex="-1" role="dialog"

     aria-labelledby="myModalLabel">

    <div class="modal-dialog" role="document">

        <div class="modal-content">

            <div class="modal-header">

                <button type="button" class="close" data-dismiss="modal"

                        aria-label="Close"><span

                        aria-hidden="true">&times;</span></button>

                <h4 class="modal-title" id="myModalLabel">Modal title</h4>

            </div>

            <div class="modal-body">

                <p>

                    Text in a modal

                </p>

                <ul>

                    <li>1</li>

                    <li>2</li>

                    <li>3</li>

                    <li>4</li>

                    <li>5</li>

                    <li>6</li>

                    <li>7</li>

                    <li>8</li>

                    <li>9</li>

                    <li>10</li>

                    <li>1</li>

                    <li>2</li>

                    <li>3</li>

                    <li>4</li>

                    <li>5</li>

                    <li>6</li>

                    <li>7</li>

                    <li>8</li>

                    <li>9</li>

                    <li>10</li>

                    <li>1</li>

                    <li>2</li>

                    <li>3</li>

                    <li>4</li>

                    <li>5</li>

                    <li>6</li>

                    <li>7</li>

                    <li>8</li>

                    <li>9</li>

                    <li>10</li>

                    <li>1</li>

                    <li>2</li>

                    <li>3</li>

                    <li>4</li>

                    <li>5</li>

                    <li>6</li>

                    <li>7</li>

                    <li>8</li>

                    <li>9</li>

                    <li>10</li>

                    <li>1</li>

                    <li>2</li>

                    <li>3</li>

                    <li>4</li>

                    <li>5</li>

                    <li>6</li>

                    <li>7</li>

                    <li>8</li>

                    <li>9</li>

                    <li>10</li>

                    <li>1</li>

                    <li>2</li>

                    <li>3</li>

                    <li>4</li>

                    <li>5</li>

                    <li>6</li>

                    <li>7</li>

                    <li>8</li>

                    <li>9</li>

                    <li>10</li>

                </ul>

            </div>

            <div class="modal-footer">

                <button type="button" class="btn btn-default"

                        data-dismiss="modal">Close

                </button>

                <button type="button" class="btn btn-primary">Save changes

                </button>

            </div>

        </div>

    </div>

</div>

</body>

<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>

<script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

<html>
#!/usr/bin/env python

# -*- coding: utf-8 -*-

from selenium import webdriver

import os

import time

driver = webdriver.Chrome()

file_path = 'file:///' + os.path.abspath("demo.html")

driver.get(file_path)

time.sleep(2)

#######在页面中直接执行js#################

driver.execute_script('$("#btn1").fadeOut();')

time.sleep(2)

#######在某个已经定位的元素上执行js########

button = driver.find_element_by_class_name('btn')

driver.execute_script('$(arguments[0]).click()', button)

time.sleep(2)

driver.switch_to.alert.accept()

time.sleep(2)

#################调用js代码##############

js = "var q=document.getElementById('username');q.style.border='1px solid red';q.value='PTQA TEST' "

driver.execute_script(js)

time.sleep(2)

js2 = "alert(666);"

driver.execute_script(js2)

time.sleep(2)

driver.switch_to.alert.accept()

time.sleep(2)

######Jquery控制浏览器内嵌div的滚动条 ####

driver.find_element_by_id('btn_myModal').click()

time.sleep(2)

js3 = '$(".modal-body").scrollTop(10000)'

driver.execute_script(js3)

time.sleep(2)

driver.find_element_by_css_selector('button.close').click()

time.sleep(2)

##########Jquery控制浏览器的滚动条 ######

js4 = '$(document).scrollTop(1000)'

driver.execute_script(js4)

time.sleep(5)

driver.close()

滚动到页面底部也可以这样

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

***微信扫一扫，关注“python测试开发圈”，了解更多测试教程！***

Selenium with Python 005 - 调用js操作页面元素的更多相关文章

  1. F12修改html进行本地js操作页面元素

    F12修改html进行本地js操作页面元素

  2. Java&Selenium调用JS实现高亮被操作页面元素高亮

    Java&Selenium调用JS实现高亮被操作页面元素高亮 /* * the method of invoking js to do something * * @author daviey ...

  3. 前端（十二）—— JavaScript基础操作：if语句、for循环、while循环、for...in、for...of、异常处理、函数、事件、JS选择器、JS操作页面样式

    JavaScript基础操作 一.分支结构 1.if语句 if 基础语法 if (条件表达式) { 代码块; } // 当条件表达式结果为true,会执行代码块:反之不执行 // 条件表达式可以为普通 ...

  4. js介绍，js三种引入方式，js选择器，js四种调试方式，js操作页面文档DOM（修改文本，修改css样式,修改属性）

    js介绍 js运行编写在浏览器上的脚本语言(外挂,具有逻辑性) 脚本语言:运行在浏览器上的独立的代码块(具有逻辑性) 操作BOM 浏览器对象盒子 操作DOM 文本对象 js三种引入方式 (1)行间式: ...

  5. selenium常用命令--操作页面元素及获取元素内容整理

    selenium常用命令之操作页面元素及获取元素内容的事件整理 例子:  /**id <input type="text" id="phone" name ...

  6. [Selenium] 操作页面元素等待时间

    WebDriver 在操作页面元素等待时间时,提供2种等待方式:一个为显式等待,一个为隐式等待,其区别在于: 1)显式等待:明确地告诉 WebDriver 按照特定的条件进行等待,条件未达到就一直等待 ...

  7. 在python中调用js或者nodejs

    在python中调用js或者nodejs要使用PyExecJs第三方包. pip install pyexecjs 示例代码 >>> import execjs >>&g ...

  8. 利用 jQuery 操作页面元素的方法，实现电商网站购物车页面商品数量的增加和减少操作，要求单项价格和总价随着数量的改变而改变

    查看本章节 查看作业目录 需求说明: 利用 jQuery 操作页面元素的方法,实现电商网站购物车页面商品数量的增加和减少操作,要求单项价格和总价随着数量的改变而改变 当用户单击"+" ...

  9. 使用javaScript操作页面元素

    from selenium import webdriver import time import unittest from selenium.common.exceptions import We ...

随机推荐

  1. 如何在 window 上面输入特殊字符？

    打开 字符映射表 程序 选中任意一个字符,它会在下方显示该字符的 16进制 转换16进制至10进制,并在输入法打开的状态下,按住 Alt 键输入 10 进制数值即可.

  2. JVM的JIT机制

    因为 JVM 的 JIT 机制的存在,如果某个函数被调用多次之后,JVM 会尝试将其编译成为机器码从而提高执行速度.

  3. nodejs使用——以elasticsearch-exporter为例

    安装nodejs: yum install nodejs 运行node命令查看是否安装成功: 可以看到成功进入命令行,安装成功. node命令前面要加点,使用 .help 查看有哪些命令: 使用.ex ...

  4. 009-shiro与spring web项目整合【三】验证码、记住我

    一.验证码 1.自定义FormAuthenticationFilter 需要在验证账号和名称之前校验验证码 /** * * <p>Title: CustomFormAuthenticati ...

  5. SQL2000查看表的大小

    SQL2000查看表的大小 标签: sqlsql server数据库报表tableinsert 2011-06-08 11:47 4013人阅读 评论(0) 收藏 举报 SQL2000查看表的大小 本 ...

  6. Ubuntu 16.04 安装 JDK 及 Eclipse 详细步骤(转发：https://blog.csdn.net/bluish_white/article/details/56509446)

    2017.3.1更新 修正了一些命令,现在按照文章步骤配置不会出现问题了. JDK 安装及配置 参考来源:http://www.linuxidc.com/Linux/2017-02/140908.ht ...

  7. Divide by Zero 2017 and Codeforces Round #399 (Div. 1 + Div. 2, combined) A. Oath of the Night's Watch

    地址:http://codeforces.com/problemset/problem/768/A 题目: A. Oath of the Night's Watch time limit per te ...

  8. Struct2小组开发简单命名规范

    基本原则或者说理念:简单就是美 1.数据库名:项目名 2.表名:_model名 3.字段:和model中的属性名一致(不要和数据库名冲突) 4.用层来划分包:com.liying.bbs.action ...

  9. 新建Maven项目时出错：org.apache.maven.archiver.MavenArchiver.getManifest

    新建Maven项目时出错:org.apache.maven.archiver.MavenArchiver.getManifest eclipse新建maven项目时,pom.xml文件第一行报错: o ...

  10. Linux内核参数之rp_filter

    一.rp_filter参数介绍 rp_filter参数用于控制系统是否开启对数据包源地址的校验. 首先看一下Linux内核文档documentation/networking/ip-sysctl.tx ...