我正在和木偶師一起作業。我有一張桌子，如螢屏截圖所示。在根據左側的名稱列選擇行后，我需要能夠在一行中單擊操作下的按鈕。
基于使用謂詞謂詞的html選擇器
我有：
const parent = await page.$eval('td[title="18to22"]', el => el?.parentElement?.outerHTML)
這確實有效并為父元素提供了 html，但我想獲取父元素句柄（https://puppeteer.github.io/puppeteer/docs/next/puppeteer.elementhandle/ ），然后是最后一個子元素句柄應該包含可點擊的視圖按鈕。
我試過：
const parent = await targetPage.$$eval(
'td[title="18to22"]',
(el) => el?.parentElement
);
這會產生未定義的。
如何獲得父元素和最終的子元素句柄？
uj5u.com熱心網友回復：
我相信您無法將已評估的元素轉換回 ElementHandle。
我會做以下事情來實作你所需要的：
- 獲取行的內容
page.$$eval（回傳字串陣列） - 使用獲取包含所需名稱（'18to22'）的行的索引
Array.findIndex() - 現在您知道了需要用一個數字遞增的索引（因為 CSS 的
nth-child()偽類使用從 1 開始的數字，而不是像常規 JS 陣列那樣從 0 開始） - 因此您可以使用以下 CSS 選擇器來獲取確切的行：
tbody > tr:nth-child(${wantedRowIndex 1}) - ...第五列包含按鈕：
> td:nth-child(5) - ...按鈕在我看來是一個
<a>元素，因此您可以> a在選擇器的末尾添加以定位您要單擊的鏈接 - 終于可以
HTMLElement.click()在頁面功能中申請了page.$eval
例子：
const rows = await page.$$eval('tbody > tr', elems => elems.map(el => el.innerText))
const wantedRowIndex = rows.findIndex(el => el.includes('18to22'))
await page.$eval(`tbody > tr:nth-child(${wantedRowIndex 1}) > td:nth-child(5) > a`, el => el.click())
轉載請註明出處，本文鏈接：https://www.uj5u.com/caozuo/459038.html
標籤：javascript 节点.js dom 傀儡师