node.js - puppeteer 操纵者的 ElementHandle.getProperty() 的预期行为是什么？

Question

Puppeteer 1.0.0-发布。 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 属性。看起来 puppeteer 的 getProperty() 实际上试图以某种方式解析样式，但解析存在错误/不完整。获取原始文本的唯一方法是通过迂回调用 evaluateHandle(...)。

这是一个预期的功能，而仅仅是一个文档错误吗？还是完全是 puppeteer 错误？

谢谢。

Answer 1

参见 HTML - attributes vs properties HTML 属性和 DOM 属性之间的区别。

您也可以在没有 Puppeteer 的情况下轻松看出差异。例如，在此页面上:

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

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