使图像在通过javascript创建的弹出窗口中工作

Question

我有一个弹出窗口，所有数据都是通过javascript添加的。但是，添加的所有图像都无法解决。如何在不提供绝对URL的情况下使图像正常工作？

JSFiddle

$("#openPopup").click(function() {
    var win = window.open();
    var body = $(win.document.body);

    $(body).append($("<img src='/img/logo.png' style='background:blue' />"));
    $(body).append($("<div>Hello World</div>"));
});

Answer 1

window.location.hostname应该这样做。

$(body).append($("<img src='http://"+window.location.hostname+"/img/logo.png' style='background:blue' />"));

http://jsfiddle.net/babumxx/v2zKa/2/

http://fiddle.jshell.net/babumxx/v2zKa/2/show/

Answer 2

UI元素最适合用作CSS背景：

#openPopup {
     background-image:url(img/logo.png);
     background-repeat:no-repeat;
     background-position:10px 10px;
}

CSS路径是相对于样式表的位置，而不是页面本身。