ElementHandle 类
ElementHandle 代表页面中的 DOM 元素。
签名：
export declare abstract class ElementHandle<ElementType extends Node = Element> extends JSHandle<ElementType>
扩展： JSHandle<ElementType>
备注
ElementHandles 可以使用 Page.$() 方法创建。
import puppeteer from 'puppeteer';
(async () => {
const browser = await puppeteer.launch();
const page = await browser.newPage();
await page.goto('https://example.com');
const hrefElement = await page.$('a');
await hrefElement.click();
// ...
})();
ElementHandle 阻止 DOM 元素被垃圾回收，除非句柄被 释放。当它们的源框架被导航时，ElementHandles 会自动释放。
ElementHandle 实例可以用作 Page.$eval() 和 Page.evaluate() 方法的参数。
如果您使用的是 TypeScript，ElementHandle 会接受一个泛型参数，该参数表示句柄持有的元素类型。例如，如果您有一个指向 <select> 元素的句柄，您可以将其类型化为 ElementHandle<HTMLSelectElement>，这样您就可以获得一些更好的类型检查。
此类的构造函数被标记为内部。第三方代码不应直接调用构造函数或创建扩展 ElementHandle 类的子类。
属性
| 属性 | 修饰符 | 类型 | 描述 |
|---|---|---|---|
| frame | 只读 | 框架 | 对应于当前句柄的框架。 |
方法
| 方法 | 修饰符 | 描述 |
|---|---|---|
| $(selector) | 在当前元素中查询与给定选择器匹配的元素。 | |
| $$(selector) | 在当前元素中查询与给定选择器匹配的所有元素。 | |
| $$eval(selector, pageFunction, args) | 在当前元素中对与给定选择器匹配的元素数组运行给定的函数。 如果给定的函数返回一个 promise，那么此方法将等待 promise 解析。 | |
| $eval(selector, pageFunction, args) | 在当前元素中对与给定选择器匹配的第一个元素运行给定的函数。 如果给定的函数返回一个 promise，那么此方法将等待 promise 解析。 | |
| autofill(data) | 如果元素是表单输入，您可以使用 ElementHandle.autofill() 来测试表单是否与浏览器的自动填充实现兼容。如果表单无法自动填充，则会抛出错误。 | |
| boundingBox() | 此方法返回元素的边界框（相对于主框架），如果元素 不是布局的一部分（例如：display: none），则返回 null。 | |
| boxModel() | 此方法返回元素的框，如果元素 不是布局的一部分（例如：display: none），则返回 null。 | |
| click(this, options) | 此方法在需要时将元素滚动到视图中，然后使用 Page.mouse 点击元素的中心。如果元素已从 DOM 中分离，则该方法会抛出错误。 | |
| clickablePoint(offset) | 返回元素内的中间点，除非提供了特定的偏移量。 | |
| contentFrame(this) | 解析与元素关联的框架（如果有）。对于 HTMLIFrameElements 始终存在。 | |
| contentFrame() | ||
| drag(this, target) | 将元素拖动到给定元素或点上。 | |
| dragAndDrop(this, target, options) | ||
| dragEnter(this, data) | ||
| dragOver(this, data) | ||
| drop(this, element) | 将给定元素放到当前元素上。 | |
| drop(this, data) | ||
| focus() | 在元素上调用 focus。 | |
| hover(this) | 此方法在需要时将元素滚动到视图中，然后使用 Page 将鼠标悬停在元素的中心。如果元素已从 DOM 中分离，则该方法会抛出错误。 | |
| isHidden() | 使用与 ElementHandle.waitForSelector() 相同的机制检查元素是否隐藏。 | |
| isIntersectingViewport(this, options) | 如果元素在当前视窗中可见，则解析为 true。如果元素是 SVG，我们将检查 svg 所有者元素是否在视窗中。请参阅 https://crbug.com/963246。 | |
| isVisible() | 使用与 ElementHandle.waitForSelector() 相同的机制检查元素是否可见。 | |
| press(key, options) | 聚焦元素，然后使用 Keyboard.down() 和 Keyboard.up()。 | |
| screenshot(options) | 此方法在需要时将元素滚动到视图中，然后使用 Page.screenshot() 对元素进行截图。如果元素已从 DOM 中分离，则该方法会抛出错误。 | |
| screenshot(options) | ||
| scrollIntoView(this) | 使用自动化协议客户端或通过调用 element.scrollIntoView 将元素滚动到视图中。 | |
| select(values) | 在所有提供的选项都被选中后，触发 change 和 input 事件。如果没有匹配 selector 的 <select> 元素，则该方法会抛出错误。 | |
| tap(this) | 此方法在需要时将元素滚动到视图中，然后使用 Touchscreen.tap() 点击元素的中心。如果元素已从 DOM 中分离，则该方法会抛出错误。 | |
| toElement(tagName) | 将当前句柄转换为给定元素类型。 | |
| touchEnd(this) | ||
| touchMove(this) | ||
| touchStart(this) | ||
| type(text, options) | 将元素聚焦，然后为文本中的每个字符发送一个 要按下特殊键，例如 | |
| uploadFile(this, paths) | 将输入元素的值设置为给定的文件路径。 | |
| waitForSelector(selector, options) | 等待与给定选择器匹配的元素出现在当前元素中。 与Frame.waitForSelector()不同，此方法不会跨导航工作，也不会在元素从 DOM 中分离时工作。 |