0

I'm trying to get the text color and the background color of all p elements on a page:

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);

This prints:

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

But if I go on chrome and check on the first p element computed style, it shows:

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

This is supossed to get me the "computed" style, so why is it not doing that? What am I missing here? it should print brackground-color: rgb(67, 65, 62)

Artemio Ramirez
  • 1,116
  • 1
  • 10
  • 23

1 Answers1

0

I'm not sure where you're running this code, but I anticipate that the style is being changed programatically. The problem most likely is that you're checking the value manually in chrome after the change has occurred, but phantomJS is checking the value too early. Perhaps putting your console logs into a function, and executing that function on a delay (ex. by using setTimeout) will solve the problem.

hemelamed
  • 56
  • 4