如何向下或向上滚动页面 Selenium 网络驱动程序

⚡ 智能摘要

在页面中滚动 Selenium WebDriver 使用 Javascript执行器接口运行 Java由于 WebDriver 直接操作 DOM，因此需要编写滚动命令。以下四个实际场景涵盖了按像素滚动、滚动到特定元素、滚动到页面底部以及水平滚动。

📜 Javascript执行人： 运行 Java脚本滚动命令 Selenium WebDriver。
🔢 按像素滚动： window.scrollBy(x,y) 将页面移动指定的像素数。
🎯 滚动到元素： scrollIntoView() 函数会滚动直到目标元素完全可见。
⬇️ 滚动到页面底部： scrollTo 操作使用 document.body.scrollHeight 到达页面底部。
↔️ 横向滚动： scrollIntoView 还会横向移动到屏幕外的元素。
🧭 滚动条基础知识： 滚动即可显示仅在进入视图时才会加载的元素。

滚动进入 Selenium

使用以下方式滚动 Selenium，你可以使用 JavaScriptExecutor 接口帮助执行 Java通过脚本方法 Selenium 网络驱动程序

语法：

JavascriptExecutor js = (JavascriptExecutor) driver;  
   js.executeScript(Script,Arguments);

脚本 – 这是 Java需要执行的脚本。
参数 – 这是脚本的参数。它是可选的。

什么是滚动条？

如果当前页面滚动不适合屏幕的可见区域，滚动条可让您在水平或垂直方向上移动屏幕。它用于上下移动窗口。

Selenium Webdriver 不需要滚动来执行操作，因为它可以操作 DOM。但在某些网页中，元素只有在用户滚动到它们后才可见。在这种情况下，滚动可能是必要的。

滚动条有两种类型：横和垂直滚动条如下面的屏幕截图所示。

Selenium 向下滚动页面的脚本

让我们看看使用 selenium webdriver 向下滚动网页的以下 4 种场景：

场景一：以像素为单位向下滚动网页。
场景 2：通过元素的可见性向下滚动网页。
场景三：在页面底部向下滚动网页。
场景四：网页水平滚动。

场景一：以像素为单位向下滚动网页。

Selenium 脚本

import org.openqa.selenium.JavascriptExecutor;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.chrome.ChromeDriver;
import org.testng.annotations.Test;

public class ScrollByPixel {

    WebDriver driver;
    @Test
    public void ByPixel() {
        System.setProperty("webdriver.chrome.driver", "E://Selenium//Selenium_Jars//chromedriver.exe");
        driver = new ChromeDriver();

        JavascriptExecutor js = (JavascriptExecutor) driver;

        // Launch the application		
        driver.get("https://demo.guru99.com/test/guru99home/");

        //To maximize the window. This code may not work with Selenium 3 jars. If script fails you can remove the line below		
        driver.manage().window().maximize();

        // This  will scroll down the page by  1000 pixel vertical		
        js.executeScript("window.scrollBy(0,1000)");
    }
}

脚本 Description在上述代码中，我们首先启动给定的程序。 URL 在Chrome浏览器中，然后通过executeScript将页面滚动1000像素。 Javascript 方法 ScrollBy() 将网页滚动到特定像素数。

ScrollBy() 方法的语法是：

executeScript("window.scrollBy(x-pixels,y-pixels)");

x-pixels 是 x 轴上的数字，如果数字为正数，则向左移动，如果数字为负数，则向右移动。y-pixels 是 y 轴上的数字，如果数字为正数，则向下移动，如果数字为负数，则向上移动。

计费示例：

js.executeScript("window.scrollBy(0,1000)"); //Scroll vertically down by 1000 pixels

输出分析： 这是执行上述脚本时的输出。

场景 2：通过元素的可见性向下滚动网页。

Selenium 脚本

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;
import org.testng.annotations.Test;

public class ScrollByVisibleElement {

    WebDriver driver;
    @Test
    public void ByVisibleElement() {
        System.setProperty("webdriver.chrome.driver", "G://chromedriver.exe");
        driver = new ChromeDriver();
        JavascriptExecutor js = (JavascriptExecutor) driver;

        //Launch the application		
        driver.get("https://demo.guru99.com/test/guru99home/");

        //Find element by link text and store in variable "Element"        		
        WebElement Element = driver.findElement(By.linkText("Linux"));

        //This will scroll the page till the element is found		
        js.executeScript("arguments[0].scrollIntoView();", Element);
    }
}

脚本 Descript离子： 在上面的代码中，我们首先在 Chrome 浏览器中启动给定的 url。接下来，滚动页面，直到所提及的元素在当前页面上可见。 Javascript 方法 scrollIntoView() 滚动页面直到所提及的元素完全显示出来：

js.executeScript("arguments[0].scrollIntoView();",Element );

“arguments[0]” 表示从 0 开始的页面第一个索引。

其中“元素”是网页上的定位器。

输出分析： 这是执行上述脚本时的输出。

场景三：在页面底部向下滚动网页。

Selenium 脚本

import org.openqa.selenium.JavascriptExecutor;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.chrome.ChromeDriver;
import org.testng.annotations.Test;

public class ScrollByPage {

    WebDriver driver;
    @Test
    public void ByPage() {
        System.setProperty("webdriver.chrome.driver", "E://Selenium//Selenium_Jars//chromedriver.exe");
        driver = new ChromeDriver();

        JavascriptExecutor js = (JavascriptExecutor) driver;

        // Launch the application		
        driver.get("https://demo.guru99.com/test/guru99home/");

        //This will scroll the web page till end.		
        js.executeScript("window.scrollTo(0, document.body.scrollHeight)");
    }
}

脚本 Descript离子： 在上面的代码中，我们首先在 Chrome 浏览器中启动给定的 url。接下来，滚动到页面底部。 Javascript 方法 scrollTo() 滚动到页面末尾。

js.executeScript("window.scrollTo(0, document.body.scrollHeight)");

“document.body.scrollHeight” 返回网页主体的完整高度。

输出分析： 这是执行上述脚本时的输出。

场景四：网页横向滚动

Selenium 脚本

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;
import org.testng.annotations.Test;

public class HorizontalScroll {

    WebDriver driver;
    @Test
    public void ScrollHorizontally() {
        System.setProperty("webdriver.chrome.driver", "E://Selenium//Selenium_Jars//chromedriver.exe");
        driver = new ChromeDriver();

        JavascriptExecutor js = (JavascriptExecutor) driver;

        // Launch the application		
        driver.get("https://demo.guru99.com/test/guru99home/scrolling.html");

        WebElement Element = driver.findElement(By.linkText("VBScript"));

        //This will scroll the page Horizontally till the element is found		
        js.executeScript("arguments[0].scrollIntoView();", Element);
    }
}

脚本 Descript离子： 在上面的代码中，我们首先在 Chrome 浏览器中启动给定的 url。接下来，水平滚动页面，直到所提及的元素在当前页面上可见。 Javascript 方法 scrollIntoView() 滚动页面直到所提及的元素完全显示出来：

js.executeScript("arguments[0].scrollIntoView();",Element );

输出分析： 这是执行上述脚本时的输出。

进一步了解 Java脚本执行器

常见问题

使用 `window.scrollBy` 时，可以使用负像素值，例如 `js.executeScript with window.scrollBy(0,-1000)`。负的 y 值会使页面向上滚动，与正值使页面向下滚动相反。

是的。您可以向元素发送 Keys.PAGE_DOWN、Keys.END 或方向键，或者使用 Actions 类。 Selenium 4. Javascript执行者仍然是最灵活的选择。

浏览器只会捕获可见视口区域，因此脚本会滚动页面，捕获各个部分并进行拼接。滚动还会触发屏幕截图之前延迟加载的图像和内容。

是的。人工智能助手可以根据简单的指令生成 scrollBy、scrollIntoView 和 scrollTo 等代码片段，并解释像素计算。 Rev在您的套件中运行定位器和等待条件之前，请查看它们。

人工智能驱动的工具能够检测新内容何时停止加载，动态调整滚动深度，并智能地等待元素加载完毕。这可以自动测试无限滚动信息流，而无需硬编码像素计数。

scrollBy 会将页面从当前位置移动固定数量的像素。scrollIntoView 会滚动页面直到特定元素可见。scrollBy 用于控制滚动距离，scrollIntoView 用于指定滚动目标元素。

如何向下或向上滚动页面 Selenium 网络驱动程序

滚动进入 Selenium

什么是滚动条？

场景一：以像素为单位向下滚动网页。

场景 2：通过元素的可见性向下滚动网页。

场景三：在页面底部向下滚动网页。

场景四：网页横向滚动

常见问题

总结一下这篇文章：

注册简报

滚动进入 Selenium

什么是滚动条？

场景一：以像素为单位向下滚动网页。

相关文章

场景 2：通过元素的可见性向下滚动网页。

场景三：在页面底部向下滚动网页。

场景四：网页横向滚动

常见问题

总结一下这篇文章：

注册简报