如何为JS中的图像指定两个可能的文件路径？

我已经通过Google和Stack Overflow搜索栏对此进行了一些搜索，并且没有任何相关内容显示。我甚至不确定这是否可能，所以让我知道如果不是这样。我正在寻找的是为图像设置两个可能的文件路径（SVG文件）的方法，例如，如果图像不在第一个文件路径/位置，它会尝试第二个。我有这样一个对象，以便：如何为JS中的图像指定两个可能的文件路径？

this.bookmarkButtonConfig = { 
    "oc-control": "BookmarkButton", 
    "label": "BookmarkButton", 
    "group": "primary", 
    "action": "onBookmark", 
    "buttonType": "toggle", 
    "image": "$MODULE_PATH/images/favorite-icon.svg" 
}

所有这些属性，然后被别的东西读取和上构成所述特性基础上的按钮，但是这并不重要这一点。有没有一种方法可以设置"image"，以便在一个文件路径中查找图标，然后如果不存在，它会尝试第二个文件路径？是否有某种功能或方法可以做到这一点？

感谢您的帮助！

来源

2017-07-24 Kyle M.

看看这是否有帮助。检查图像可用性（在this.bookmarkButtonConfig = {....}之前）并将其路径存储在变量中。然后在你的“图片”中使用该变量 –

你有任何框架使用？ –

@ChristianEsperar我不能添加任何框架，如果这就是你的意思。 –

是的，你可以使用AJAX调用来检查图像服务器中存在，第一次写这样的功能：

var src = imageExists(the first url) ? "the first url" : "the second url";

：

function imageExists(url){ 
    var http = new XMLHttpRequest(); 

    http.open('HEAD', image_url, false); 
    http.send(); 

    return http.status != 404; 
}

然后根据结果是这样分配的网址

来源

2017-07-24 16:04:34 Sletheren

在第四行中，image_url应该是“url”，就像函数所采用的参数一样？ –

是的，一个URL，像“http://www.example.com/path/to/image.png” – Sletheren

对不起，我不清楚。我的意思是，http.open（）的第二个参数应该与imageExists（）函数的参数相同？ –

如何为JS中的图像指定两个可能的文件路径？

回答

相关问题