Javascript: Получить исходный URL-адрес <div>

Ответ 1

Вы можете попробовать это:

var img = document.getElementById('your_div_id'),
style = img.currentStyle || window.getComputedStyle(img, false),
bi = style.backgroundImage.slice(4, -1).replace(/"/g, "");

// Get the image id, style and the url from it
var img = document.getElementById('testdiv'),
  style = img.currentStyle || window.getComputedStyle(img, false),
  bi = style.backgroundImage.slice(4, -1).replace(/"/g, "");

// Display the url to the user
console.log('Image URL: ' + bi);

<div id="testdiv" style="background-image:url('http://placehold.it/200x200');"></div>

Ответ 2

Просто чтобы добавить к этому, если у кого-то еще есть похожая идея, вы также можете использовать Regex:

var url = backgroundImage.match(/url\(["']?([^"']*)["']?\)/)[1];

Однако, похоже, решение @Praveen на самом деле работает лучше в Safari и Firefox, согласно jsPerf: http://jsperf.com/match-vs-slice-and-replace

Если вы хотите учесть случаи, когда значение включает в себя кавычки, но вы не уверены, является ли это двойной или одинарной кавычкой, вы можете сделать следующее:

var url = backgroundImage.slice(4, -1).replace(/["']/g, "");

Ответ 3

Попробуйте это:

var url = document.getElementById("divID").style.backgroundImage;
alert(url.substring(4, url.length-1));

Или с помощью replace:

url.replace('url(','').replace(')','');
// Or...
backgroundImage.slice(4, -1).replace(/["']/g, "");

Ответ 4

Прежде всего вам необходимо вернуть содержимое фонового изображения:

var img = $('#your_div_id').css('background-image');

URL-адрес будет возвращен следующим образом:

"URL ( 'http://www.example.com/img.png')"

Затем вам нужно удалить ненужные части этого URL:

img = img.replace(/(url\(|\)|")/g, '');