章节十四、3-执行JavaScript命令

一、网页页面都是由html+css和javaScript组成的，如果页面中没有javaScript的存在，就不会有操作动作的执行，例如页面上你点击的按钮或者链接都离不开javaScript。（这一节不是为了讲javaScript的知识，对javaScript感兴趣的同学可以自己去网上找资料学习）。

二、如何用javaScript打开百度页面，并定位百度搜索输入框输入值？

package basicweb;

import java.util.concurrent.TimeUnit;

import org.junit.jupiter.api.AfterEach;
import org.junit.jupiter.api.BeforeEach;
import org.junit.jupiter.api.Test;
import org.openqa.selenium.By;
import org.openqa.selenium.JavascriptExecutor;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver;

class JavaScriptExecution {
    
    WebDriver driver;
    String url;
//    声明一个私有的JavascriptExecutor变量
    private JavascriptExecutor js;

    @BeforeEach
    void setUp() throws Exception {
        driver = new ChromeDriver();
        url = "https://www.baidu.com/";
//        把driver强制转换成JavascriptExecutor类型
        js = (JavascriptExecutor)driver;
        driver.manage().timeouts().implicitlyWait(5, TimeUnit.SECONDS);
        driver.manage().window().maximize();
    }
    
    @Test
    void test() throws InterruptedException {
//        driver.get(url);
//        通过javaScript打开网站
        js.executeScript("window.location = 'https://www.baidu.com/';");
        
//        在这里加入等待为了防止通过javascript打开网站后，会立即查找元素，而这个时候可能页面还没有加载完成，元素未被查找到，程序就会报错。   
//        而driver.get（）;会默认等到网站加载完成再执行下面的操作，所以上面的章节中不需要使用强制等待。
        Thread.sleep(3000);
        
        
//        WebElement text = driver.findElement(By.id("kw"));
//        通过javaScript查找搜索输入框元素，因为我们需要返回元素，所以需要使用return
//        javaScript中没有By.name,By.Xpath等查找元素的方式，只有Byid，ByTagName,ByName,ByClassName，ByTagName,ByName,ByClassNameu返回的是多个元素,获取的是元素组
//        因为.getElementBy**('')返回的是object类型的元素，因此需要转型
        WebElement text = (WebElement)js.executeScript("return document.getElementById('kw');");
        text.sendKeys("test");
    }

    @AfterEach
    void tearDown() throws Exception {
        Thread.sleep(2000);
        driver.quit();
    }
}

三、注意事项

1、javaScript中没有By.name,By.Xpath等查找元素的方式，只有ById，ByTagName,ByName,ByClassName，ByTagName,ByName,ByClassNameu返回的是多个元素,获取的是类数组。

document.getElementById();//id
document.getElementsByTagName();//标签名；Elements加了S，选出来是类数组；
document.getElementsByName();//name属性，部分标签可以；Elements加了S，选出来是类数组；
document.getElementsByClassName();//class；Elements加了S，选出来是类数组；IE9以下不支持；

2、使用Javascript进行操作时，需要driver（浏览器对象）强制转换成JavascriptExecutor类型。

3、使用Javascript进行操作打开网页时，为了防止出现页面未加载完成而导致查找元素失败的情况出现，我们需要在进入页面后最好加上强制等待。

4、因为.getElementBy**('')查找的元素返回的是object类型的元素，因此需要转型，这里是webElement类型的所以需要用WebElement类型的来接收返回的值，如果是其它类型的变量则需要用相对应的类型来接收。

 

如果有不明白的小伙伴可以加群“555191854”问我，群里都是软件行业的小伙伴相互一起学习。