puppeteer/assets/js/4807700c.f7ed68ea.js

/*! For license information please see 4807700c.f7ed68ea.js.LICENSE.txt */
"use strict";(self.webpackChunkwebsite=self.webpackChunkwebsite||[]).push([[72717],{63e3:(e,t,n)=>{n.r(t),n.d(t,{assets:()=>h,contentTitle:()=>d,default:()=>o,frontMatter:()=>l,metadata:()=>i,toc:()=>a});var r=n(85893),s=n(11151);const l={sidebar_label:"ElementHandle"},d="ElementHandle class",i={id:"api/puppeteer.elementhandle",title:"ElementHandle class",description:"ElementHandle represents an in-page DOM element.",source:"@site/../docs/api/puppeteer.elementhandle.md",sourceDirName:"api",slug:"/api/puppeteer.elementhandle",permalink:"/next/api/puppeteer.elementhandle",draft:!1,unlisted:!1,tags:[],version:"current",frontMatter:{sidebar_label:"ElementHandle"},sidebar:"api",previous:{title:"JSHandle.toString",permalink:"/next/api/puppeteer.jshandle.tostring"},next:{title:"ElementHandle.$",permalink:"/next/api/puppeteer.elementhandle._"}},h={},a=[{value:"Signature:",id:"signature",level:4},{value:"Remarks",id:"remarks",level:2},{value:"Properties",id:"properties",level:2},{value:"Methods",id:"methods",level:2}];function c(e){const t={a:"a",code:"code",h1:"h1",h2:"h2",h4:"h4",p:"p",pre:"pre",strong:"strong",table:"table",tbody:"tbody",td:"td",th:"th",thead:"thead",tr:"tr",...(0,s.a)(),...e.components};return(0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)(t.h1,{id:"elementhandle-class",children:"ElementHandle class"}),"\n",(0,r.jsx)(t.p,{children:"ElementHandle represents an in-page DOM element."}),"\n",(0,r.jsx)(t.h4,{id:"signature",children:"Signature:"}),"\n",(0,r.jsx)(t.pre,{children:(0,r.jsx)(t.code,{className:"language-typescript",children:"export declare abstract class ElementHandle<ElementType extends Node = Element> extends JSHandle<ElementType>\n"})}),"\n",(0,r.jsxs)(t.p,{children:[(0,r.jsx)(t.strong,{children:"Extends:"})," ",(0,r.jsx)(t.a,{href:"/next/api/puppeteer.jshandle",children:"JSHandle"}),"<ElementType>"]}),"\n",(0,r.jsx)(t.h2,{id:"remarks",children:"Remarks"}),"\n",(0,r.jsxs)(t.p,{children:["ElementHandles can be created with the ",(0,r.jsx)(t.a,{href:"/next/api/puppeteer.page._",children:"Page.$()"})," method."]}),"\n",(0,r.jsx)(t.pre,{children:(0,r.jsx)(t.code,{className:"language-ts",children:"import puppeteer from 'puppeteer';\n\n(async () => {\n  const browser = await puppeteer.launch();\n  const page = await browser.newPage();\n  await page.goto('https://example.com');\n  const hrefElement = await page.$('a');\n  await hrefElement.click();\n  // ...\n})();\n"})}),"\n",(0,r.jsxs)(t.p,{children:["ElementHandle prevents the DOM element from being garbage-collected unless the handle is ",(0,r.jsx)(t.a,{href:"/next/api/puppeteer.jshandle.dispose",children:"disposed"}),". ElementHandles are auto-disposed when their origin frame gets navigated."]}),"\n",(0,r.jsxs)(t.p,{children:["ElementHandle instances can be used as arguments in ",(0,r.jsx)(t.a,{href:"/next/api/puppeteer.page._eval",children:"Page.$eval()"})," and ",(0,r.jsx)(t.a,{href:"/next/api/puppeteer.page.evaluate",children:"Page.evaluate()"})," methods."]}),"\n",(0,r.jsxs)(t.p,{children:["If you're using TypeScript, ElementHandle takes a generic argument that denotes the type of element the handle is holding within. For example, if you have a handle to a ",(0,r.jsx)(t.code,{children:"<select>"})," element, you can type it as ",(0,r.jsx)(t.code,{children:"ElementHandle<HTMLSelectElement>"})," and you get some nicer type checks."]}),"\n",(0,r.jsxs)(t.p,{children:["The constructor for this class is marked as internal. Third-party code should not call the constructor directly or create subclasses that extend the ",(0,r.jsx)(t.code,{children:"ElementHandle"})," class."]}),"\n",(0,r.jsx)(t.h2,{id:"properties",children:"Properties"}),"\n",(0,r.jsxs)(t.table,{children:[(0,r.jsx)(t.thead,{children:(0,r.jsxs)(t.tr,{children:[(0,r.jsx)(t.th,{children:"Property"}),(0,r.jsx)(t.th,{children:"Modifiers"}),(0,r.jsx)(t.th,{children:"Type"}),(0,r.jsx)(t.th,{children:"Description"})]})}),(0,r.jsx)(t.tbody,{children:(0,r.jsxs)(t.tr,{children:[(0,r.jsx)(t.td,{children:"frame"}),(0,r.jsx)(t.td,{children:(0,r.jsx)("code",{children:"readonly"})}),(0,r.jsx)(t.td,{children:(0