Question

我有一个ElementHandle，而不是它的选择器，我如何获取其Parent和Siblings作为ElementHandle。

我知道给定元素选择器，可以使用

const item = document.querySelector(query);
const parent = item.parentElement;

如果我拥有ElementHandle而不是其选择器，该怎么办。请帮忙。

Answer 1

您可以使用elementHandle.$x()来评估相对于elementHandle的XPath表达式，以获得给定元素的父级和同级：

const example = await page.$('#example'); // Element
const example_parent = (await example.$x('..'))[0]; // Element Parent
const example_siblings = await example.$x('following-sibling::*'); // Element Siblings

Answer 2

试试这个

const parentElement = await exampleElement.evaluateHandle(
    (element) => element?.parentElement?.parentElement?.parentElement?.parentElement?.parentElement,
);

Answer 3

尽管此问题被标记为puppeteer，但它在Google中以“ Playwright”的名字出现在类似搜索中的情况最明显。

对于使用Playwright的用户，您可以使用类似的解决方案（从answer provided by @grant-miller中采用）：

const example = await page.$('#example'); // Element
const example_parent = (await example.$('xpath=..')); // Element Parent
const example_grandparent = (await example.$('xpath=../..')); // Element Grandparent
const example_siblings = await example.$$('xpath=following-sibling::*'); // Element Siblings

Answer 4

试试这个

const parent_node = await child_node.getProperty('parentNode')

如何在NodeJS中获得ElementHandle的父级和同级？

4 个答案: