当我尝试将背景图像添加到 jQuery 中的 div 时，我不断收到 404 错误答案

【问题标题】：I keep getting a 404 error when I try to add a background image to a div in jQuery当我尝试将背景图像添加到 jQuery 中的 div 时，我不断收到 404 错误
【发布时间】：2017-07-04 06:20:51
【问题描述】：

当我在搜索栏中按 Enter 时，我正在尝试创建一个 div。这部分对我有用，如果我一直按 enter，则会创建一个新的 div。但是，我不能给创建的 div 一个背景图像。我的控制台一直给我一个 404 错误。这是我的代码：

function appendToDom(poster) {
    var aPoster = $('<div>');
    aPoster.css({
        display: 'inline block',
        float: 'left',
        margin: '10px',
        marginLeft: '37px',
        marginTop: '20px',
        width: '200px',
        height: '300px',
        fontSize: '36px',
        color: 'black'
        //backgroundImage: '../services/images/1425663956-outline.png'
    })
    $(aPoster).css("background-image", "url(~/desktop/MyMovies/public/js/images/1425663956-outline.png)");
    $(main).append(aPoster);

我试图把我的图像文件放在一堆地方，我改变了很多次路径。我的最终目标是将我正在使用的 api 提供的图像添加为每个 div 的背景图像，并在 api 没有给定数据点的图像时将我当前尝试使用的图像作为默认值。

如果有帮助，我正在节点中工作。

【问题讨论】：

如果您收到 404 表示您的图像路径不正确，而不是您的代码错误。我怀疑您的问题是您使用的是波浪号（~）与绝对路径。尝试先在浏览器中导航到该图像，然后采用该路径并将其粘贴到您的代码中。如果这只是本地的，图像应该会解析。

标签： javascript jquery html css node.js

【解决方案1】：

我发现使用相对目录更容易/更好。类似于您在示例的注释掉部分中的方式。在我看来，程序将使用的文件或资产应该在你的项目文件夹中的某个地方。

根据您的文件系统尝试url(./../images/question.png)。

【讨论】：

我现在得到了图像，但它不会显示。这是我的代码：
函数 appendToDom(poster) { var aPoster = $('
'); aPoster.css({ display: 'inline block', float: 'left', margin: '10px', marginLeft: '37px', marginTop: '20px', width: '200px', height: '300px', fontSize: '36px'，颜色：'black'，backgroundColor：'white'，backgroundSize：'200px 300px'，backgroundImage：'./../images/question.png' })$(main).append(aPoster); }
我编辑了我的答案以更适合您。我会尝试将它包装在 url(...) 中，而且 backgroundColor 可能与这些东西冲突。我会对此发表评论以供测试

【解决方案2】：

你可以这样试试吗：

$(aPoster).attr("style","background-image: url(~/desktop/MyMovies/public/js/images/1425663956-outline.png)");

【讨论】：

【解决方案3】：

浏览器不理解文件路径~/desktop/MyMovies/public/js/images/1425663956-outline.png中的~。它只在可以访问本地文件系统的 shell 中有意义。您需要使用提供该图像文件的 URL。

【讨论】：

如果该图像不是来自网络并且它在我的计算机上的 MyMovies 目录中怎么办？