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. 模块 - time/datetime

    time 模块 time模块方法: >>> import time >>> time.time() #时间戳 秒级别 1519212085.6211221 #从19 ...

  2. Spring 框架的事务管理

    1. Spring 框架的事务管理相关的类和API PlateformTransactionManager 接口: 平台事务管理器(真正管理事务的类); TransactionDefinition 接 ...

  3. 克隆DOM元素 ele.cloneNode();

    var nodePrev = p.children[j].cloneNode(true); var nodeNext = p.children[j + 1].cloneNode(true);

  4. pandas数据结构和介绍第一天

    pandans另种主要的数据结构Series和DateFranme 1,Series 仅由一组数据就而已产生简单的Series 2)Series 有index和values属性,表达索引对象 3)设置 ...

  5. Angular路由参数传递

    一.路由时传递参数的方式 1.在查询参数中传递数据 //页面 <a routerLink="/product" [queryParams]="{id:1}" ...

  6. 修改 item2 用户名

    首先在命令行输入 cd .oh-my-zsh/themes 如下图: 然后命令行输入 sudo vi agnoster.zsh-theme 如下图: 最后在编辑主题文件 在 prompt_segmen ...

  7. ubuntu16.04 tomcat7安装和编码修改（转发：https://blog.csdn.net/zl544434558/article/details/76735564）

    有直接通过命令安装的,但是我还是喜欢把文件下载下来,然后自己配置. 1,下载tomcat7二进制文件 https://tomcat.apache.org/download-70.cgi 2,解压tom ...

  8. MariaDB复制架构中应该注意的问题

    一.复制架构中应该注意的问题: 1.限制从服务器只读 在从服务器上设置read_only=ON,此限制对拥有SUPPER权限的用户均无效: 阻止所有用户(在从服务器执行一下命令并保持此线程,也就是执行 ...

  9. webdriver的API

    基本API 1.页面刷新    driver.fresh() 2.页面切换   driver.back().  driver.forward() 3.设置窗口大小    driver.set_wind ...

  10. begoo——路由设置

    路由本质是URL与要为该URL调用的视图函数之间的映射表,其实就是你定义的使用那个URL调用那段代码的关系对应表. 首先看一下最简单的路由: package routers import ( &quo ...