selenium中使用JavascriptExecutor执行操作

        在Selenium IDE中我们可以使用runScript命令去执行js代码片段，以辅助完成一些Selenium不方便达成的任务，同样，在WebDriver中我们也可以使用JavascriptExecutor工具类去完成js代码执行，下面详细阐述该工具的使用及工作原理。

        1. JavascriptExecutor执行js代码的两种方法介绍。

        Object executeScript(String script, Object... args);

        Object executeAsyncScript(String script, Object... args);

前一个是异步执行js，后一个是同步执行js

        executeScript方法接收两个参数和一个返回值：

        script，javascript代码片段，这段js代码片段是作为js函数的完整方法体，可以使用return语句作为函数的返回值。

        args, 参数数组，参数数组用于将外部数据传递给script(js代码片段)，script中可以通过arguments[index]方式索引args数组中的参数；参数数据类型必须是以下几种（number, boolean, String, WebElement, 或者以上数据类型的List集合），当然无参数可以保留为空。

        返回值，返回值是由js代码片段计算后通过return语句返回，返回值数据类型可以为（WebElement，Double，Long，Boolean，String，List或Map），没有return语句，这里返回数据为null。

        executeAsyncScript方法接收两个参数和一个返回值：

        script，javascript代码片段，这段js代码片段是作为js函数的完整方法体，与executeScript主要有两点不同：

            1. 此处的script必须在代码结束时明确调用callback方法以通知webdriver该script执行结束；该callback方法是由webdriver注入到arguments数组中最后一个元素；可以通过arguments[arguments.length-1]获取到，且可以使用该回调函数返回计算结果（只需要将放回结果作为回调函数的参数即可）

            2. 该script执行会有超时时间，默认为60s，超时时间内未调用callback方法，JavascriptExecutor会抛出Timeout异常。

        args, 规则同executeScript。

        返回值，规则同executeScript

        2. JavascriptExecutor执行js代码的使用示例。

对js代码不熟悉，可以打开浏览器-->按F12-->点击Console-->输入document或window，后面会联想一些方法，选择来试验一下

下面介绍几种常用的js执行方法：

①、使用js执行打开https://www.baidu.com功能

一、使用js执行打开https://www.baidu.com功能
js=(JavascriptExecutor)driver;
js.executorScript("window.location='https://www.baidu.com';");

或者直接如下使用；只是可读性有点差
((JavascriptExecutor) driver).executeScript("window.location='https://www.baidu.com';");

②、通过js查找元素功能

js=(JavascriptExecutor)driver;

return返回的是通过id查找的元素，所以是webElement类型接收
WebElement el=(WebElement) js.executeScript("return document.getElementById('kw');");
el.sendKeys("javascript");

js查找元素的方法还有：getElementsByXxx，
getElementByXxx返回的是webElement，getElementsByXxx返回的是list<WebElement>，例：

js=(JavascriptExecutor)driver;
//打开浏览器，输入百度网址
js.executorScript("window.location='https://www.baidu.com';");
List<WebElement> els = (List<WebElement>) js.executorScript("return  document.getElementsByName('kw');");
//因为上面找到的是一个list，但同时又只有一个元素，
els.get(0).sendkeys("selenium");

③通过js直接set输入框的值,如下方式也能实现对文本框的输入，这是对sendKey方法的补充

WebElment el=(WebElement) js.executeScript("reture document.getElementById('kw');");
js.executeScript("arguments[0].value='selenium'", el);

④js执行点击操作

WebElment el2=(WebElement) js.executeScript("reture document.getElementById('su');");
js.executeScript("arguments[0].click();",el2);

⑤js执行页面滚动操作

js.executorScript("window.location='http://www.migang.com';");
//向下滚动 
js.executeScript("window.scrollBy(0,1900);");
Thread.sleep(2000);
//向上滚动，注意里面的值，也就是纵横坐标
js.executeScript("window.scrollBy(0,-1900);");
Thread.sleep(2000);
//定位的元素
WebElement element = driver.findElement(By.xpath("//span[contains(text(),'米缸公告')]"));
Thread.sleep(2000);
// js滚动到出现元素的位置
js.executeScript("arguments[0].scrollIntoView(true);",element);
// 这里向上滚一点，避免上面的元素被其他样式遮住，导致后面元素操作错误。
js.executeScript("window.scrollBy(0,-300);");

        3. JavascriptExecutor执行js的原理。

        如何理解JavascriptExecutor如何运行js代码，需要对javascript基础有一定的认识，首先给大家罗列两个javascript中三种定义和调用函数的示例，大家看完示例就不难理解webdriver是如何去运行javascript代码了，同时也能消除（为何在javascript中使用arguments来接收方法传入的参数）的困惑。

第一种函数定义方式：
function sum(a, b) {
    return a+b;
}
sum(2,3);  //输出5
    
第二种函数定义方式：
var sum = new Function('a', 'b', 'return a+b;');
sum(2,3)  //输出5

第二种方式我们可以改写为： 
new Function('a', 'b', 'return arguments[0]+arguments[1]').apply(null,[1,2]);  //输出5

        当然函数的定义不限于以上三种写法，我们这里重点讲解第二种和第三种方法，相信大家在看到这两种使用方式时，已经理解webdriver是如何调用js代码了，但还会疑惑为什么会使用arguments来接收参数。

        我们所有定义的function实质上是对Function类的实现，而Functions类的定义中arguments作为局部变量，通过arguments索引接收所有参数，即使在方法定义中未指定的参数，大家来看下面的代码示例：

function add(a) {
    var sum =0,
    len = arguments.length;
    for(var i=0; i<len; i++){
        sum += arguments[i];
    }
    return sum;
}
add(1,2,3,4);   //10

参考：

https://blog.51cto.com/shareku/2114589

https://blog.csdn.net/u011466469/article/details/89294709