如何从ElementHandle中获取文本？

Question

使用 PuppeteerSharp，我正试图获取元素的文本内容。

ElementHandle elementHandle = await page.XPathAsync("//html/body/div[1]/section/div/section/h2")[0];

现在我有元素句柄，该怎样从中获取文本呢？我没有看到任何明显的方法。我本来期望有TextAsync或类似的方法，但我没有看到。使用PuppeteerSharp 5.0。

- AngryHacker

---

有一个GetPropertyAsync(String)方法，请参见Puppeteer如何读取span元素的值和Puppeteer中获取选择器的值。 - Botan

@Botan 谢谢。这个行了。我用了 var foo = await elementHandle.GetPropertyAsync("innerText");，然后 foo.ToString() 有我需要的东西。 - AngryHacker

Answer 1

您可以将该ElementHandle作为参数传递给EvaluateFunction进行调用。

var content = await Page.EvaluateFunctionAsync<string>("e => e.textContent", elementHandle);

如果您有许多类似的情况，您可以构建一个扩展方法来为您解决这个问题;)

- hardkoded

Answer 2

@Botan，谢谢！ 我已经尝试过（使用VB.NET），并发现：

(Await elementhandle.GetPropertyAsync("innerText")).ToString

结果为："JSHandle:foo"，但是

(Await elementhandle.GetPropertyAsync("innerText")).RemoteObject.Value.ToString

结果："foo"

- Alexei Bogomolov

Answer 3

如果您需要一种强类型的API与Puppeteer Sharp一起使用，那么可以使用PuppeteerSharp.Dom，它可以在Nuget.org上找到。

// Add using PuppeteerSharp.Dom to access the extension methods

ElementHandle elementHandle = await page.XPathAsync("//html/body/div[1]/section/div/section/h2")[0];
// Create a strongly typed HtmlHeadingElement object
var headingElement = elementHandle.ToDomHandle<HtmlHeadingElement>();
// You'll now have context specific methods relevant to HtmlHeadingElement
//Get TextContent via the async method
var textContext = await headingElement.GetTextContentAsync();
var innerText = await headingElement.GetInnerTextAsync();

此外还有一些与QuerySelector相关的扩展方法，因此如果您使用查询选择器，则可以避免使用ToDomHandle方法。

var element = await page.QuerySelectorAsync<HtmlElement>("#myElementId");

GitHub页面上有更多的示例。

- amaitland