puppeteer 的 ElementHandle.getProperty() 的预期行为是什么？

Question

Puppeteer 1.0.0-post。这种getProperty()方法似乎有些神奇。例如，如果您的页面包含：

<a href="/foo/bar.html">link</a>

然后这将返回的不是一个相对的而是一个绝对的URL：

const propertyHandle = await elementHandle.getProperty('href');
const href = await propertyHandle.jsonValue();
// href is 'https://localhost:8080/foo/bar.html'

另一方面，如果你要做更多的迂回：

const hrefHandle = await page.evaluateHandle(element => element.getAttribute('href'), elementHandle);
const href = await hrefHandle.jsonValue();
// href is '/foo/bar.html'

据我所知，puppeteer 文档没有提到getProperty()?

它变得更丑陋，例如，如果您想获取style元素的属性。看起来 puppeteergetProperty()实际上试图以某种方式解析样式，这种解析有问题/不完整。获取原始文本的唯一方法是对evaluateHandle(...).

这是一个预期的功能，只是一个文档错误？或者这只是一个木偶操纵者的错误？

谢谢。

Answer 1

有关 HTML 属性和 DOM 属性之间的差异，请参阅HTML - 属性与属性。

即使没有 Puppeteer，您也可以轻松看到差异。例如，在此页面上：

document.getElementById('nav-questions').href    
// returns "https://stackoverflow.com/questions"

document.getElementById('nav-questions').getAttribute('href')    
// returns "/questions"