PhantomJS - 获取元素计算样式

Question

我试图获取网页上所有p元素的文字颜色和背景颜色：

elements = document.querySelectorAll("p");
console.log("elements " + elements.length);
console.log(window.getComputedStyle(elements[0]));
console.log(window.getComputedStyle(elements[0]).length);
console.log(window.getComputedStyle(elements[0]).getPropertyValue("background-color"));
console.log(window.getComputedStyle(elements[0]).getPropertyValue("color"));
console.log(elements[0].innerHTML);

打印：

background-color: rgba(0, 0, 0, 0)
color: rgb(225, 224, 220)

但是如果我继续使用chrome并检查第一个p元素计算样式，它会显示：

background-color: #43413e (67, 65, 62 as rgb)
color: #e1e0dc (225, 224, 220 as rgb)

这是为了让我得到＆＃34;计算＆＃34;风格，为什么不这样做呢？我在这里错过了什么？它应该打印brackground-color: rgb(67, 65, 62)

Answer 1

我不确定你在哪里运行这段代码，但我预计样式会以编程方式进行更改。最有可能的问题是，您在更改发生后在chrome中手动检查值，但phantomJS过早地检查了该值。也许将控制台日志放入一个函数中，并在延迟时执行该函数（例如使用setTimeout）将解决问题。