How to retrieve the background image url defined in CSS?

Question

Suppose I have a div
<div id="div_a" style="background-image:url('xxx')"></div>

Then I can get the url info by using

document.getElementById("div_a").style.backgroundImage

to get its url info.

However if the style is defined in CSS the code above would return blank

Anything wrong with it?

oh sry for the ambiguity, I mean the style sheet linked in <head> — NSF
– NSF, Commented Jun 1, 2012 at 23:47

Musa · Accepted Answer · 2012-06-01 23:39:51Z

3

What you are looking for is the computed styles getComputedStyle

window.getComputedStyle(document.getElementById("div_a"), null).getPropertyValue('background-image')

answered Jun 1, 2012 at 23:39

Musa

97.9k17 gold badges123 silver badges144 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Which browsers does this work in, though, exactly? Getting the computed style is a traditionally very tricky business.

@Pekka works fine in IE9/FF12/Chrome19 not yet tested in other versions though. Not sure if it works in prior IE versions