为什么jQuery(this).css('background-image')返回浏览器URL？

Question

我有三个div，如下所示。

<div id="div#product_img_wrapper">
    <div id="product_design1" class="timage"  style="z-index: 20; background-image: url('');"></div>
    <div id="product_design2" class="timage"  style="z-index: 20; background-image: url('');"></div>
    <div id="product_design3" class="timage"  style="z-index: 20; background-image: url('');"></div>
</div>

我使用下面的 jquery 函数在div 上方循环槽，如下所示。

jQuery('div#product_img_wrapper div').each(function(){
            var background = jQuery(this).css('background-image').replace('url(','').replace(')','');
            if(background != 'none')
            {
                console.log(jQuery(this));
                console.log(background);
            } 

        });

输出

"http://localhost/project/index.php?option=com_project&controller=project&task=project&method=1"
"http://localhost/project/index.php?option=com_project&controller=project&task=project&method=1"
"http://localhost/project/index.php?option=com_project&controller=project&task=project&method=1"

我正在尝试做的是获取每个div的背景图像属性。但它向我返回浏览器显示的这个 URL ？上面的代码有什么问题？为什么jQuery（this）.css（'background-image'）返回浏览器网址？

Answer 1

url('')是一个解析为"here"的相对URL。

您

正在获得指定的URL，只是解析为绝对形式，而不是您输入的原始相对形式。

Answer 2

URL 是相对的，并且设置为绝对值。

你应该写这个来获取背景：

var background = jQuery(this).css('background-image').replace('url(' + location.href,'').replace(')','');