Xpath 函数在 playwright 中不起作用

Question

当我尝试使用 xpath 函数时，Playwright 没有按预期工作。

这是我编写的代码，用于抓取 https://example.org 的 <h1> 标签内的文本。

const pw = require('playwright');

async function fetch(url) {
    var browser = await pw.chromium.launch();
    var context = await browser.newContext();
    var page = await context.newPage();
    await page.goto(url);
    const h1 = await page.$('//h1')
    console.log(await h1.evaluate(h1 => h1.innerHTML, h1));
    await browser.close();
}

fetch('https://example.com')

当执行此代码时完美运行并显示，

Example Domain

但是如果我尝试使用 xpath 函数 text() 获取 h1 标签内的文本，如下所示，

const h1 = await page.$('//h1/text()'); // also tried await page.$('xpath=//h1/text()');
console.log(await h1.evaluate(h1 => h1.textContent, h1));

正在投掷，

UnhandledPromiseRejectionWarning: TypeError: Cannot read property 'evaluate' of null

我是做错了什么还是它不能与 xpath 函数一起使用。

Answer 1

首先，text() 实际上并不是一个函数。它是选择包含元素的文本节点的轴步骤 child::text() 的缩写。

XPath 表达式运行良好；这是错误的调用应用程序代码。如果您的 XPath 表达式 returns 文本节点，则应用程序无法访问 textContent，因为文本节点没有 textContent 属性。那是 DOM 给你的...

Answer 2

正如 Michael 所说，$ 函数的目的是 return 一个 DOM 元素。如果要计算 XPath 表达式，可以在 evaluate 函数中使用 document.evaluate。

async function fetch(url) {
    var browser = await playwright.chromium.launch();
    var context = await browser.newContext();
    var page = await context.newPage();
    await page.goto(url);
    console.log(await page.evaluate(() => 
        document.evaluate('//h1/text()', document, null, XPathResult.STRING_TYPE).stringValue));
    await browser.close();
}

fetch('https://example.com')

Xpath 函数在 playwright 中不起作用

Xpath functions not working in playwright

javascript

xpath

node.js

web-scraping

playwright