Get the url of the background-image from an div elment with javascript

Question

I have an element in a website that looks like this:

<div id="item" style="background-image: url('url to the image')"></div>

Now I need a javascript which extracts only the url of this background-image and replaces it with an url stored in a var.

How is this possible in a "neat" way :) ?

jshanley · Accepted Answer · 2014-05-09 17:04:36Z

2

You could select the div by its id and use setAttribute to set the style attribute to a string containing the new url stored in yourVar like this:

var item = document.getElementById('item');
var newStyle = 'background-image: url(' + yourVar + ');';
item.setAttribute('style', newStyle);

answered May 9, 2014 at 17:04

jshanley

9,1382 gold badges39 silver badges45 bronze badges

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

Comments

ediblecode · Accepted Answer · 2014-05-09 16:50:50Z

1

$('#item').css('background-image', 'url(' + var + ')');

answered May 9, 2014 at 16:50

ediblecode

12k21 gold badges72 silver badges118 bronze badges

2 Comments

Lee Taylor Over a year ago

The OP didn't say they were using jQuery. Bit much to expect them to include the whole library just for that...

ohmu Over a year ago

@LeeTaylor I wouldn't say that's too much to expect. jQuery is quite common along with other similar libraries, but it should be disclosed that this requires jQuery.

Collectives™ on Stack Overflow

Get the url of the background-image from an div elment with javascript

2 Answers 2

Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related