jQuery:

$.ajax({
    url:'http://www.example.com/somefile.ext',
    type:'HEAD',
    error: function()
    {
        //file not exists
    },
    success: function()
    {
        //file exists
    }
});

编辑:

下面是检查404状态的代码，不使用jQuery

function UrlExists(url)
{
    var http = new XMLHttpRequest();
    http.open('HEAD', url, false);
    http.send();
    return http.status!=404;
}

小的改变，它可以检查状态HTTP状态码200(成功)。

编辑2:由于sync XMLHttpRequest已弃用，你可以添加一个这样的实用方法来异步执行:

function executeIfFileExist(src, callback) {
    var xhr = new XMLHttpRequest()
    xhr.onreadystatechange = function() {
        if (this.readyState === this.DONE) {
            callback()
        }
    }
    xhr.open('HEAD', src)
}

首先创建函数

美元。UrlExists =函数(url) { var http = new XMLHttpRequest(); http。open('HEAD'， url, false); http.send (); 还http.status ! = 404; ｝

使用函数后，如下所示

如果（$.UrlExists（“urlimg”））{ 照片 = “IMG1.jpg”; }else{ 照片 = “IMG2.jpg”; } $（''<img>）.attr（'src'，photo）;

这是对公认答案的改编，但我不能从答案中得到我需要的东西，必须测试它是否有效，因为这是一种直觉，所以我把我的解放在这里。

我们需要验证一个本地文件是否存在，并且只允许该文件(PDF)在存在的情况下打开。如果你省略了网站的URL，浏览器将自动确定主机名-使其在localhost和服务器上工作:

$.ajax({

    url: 'YourFolderOnWebsite/' + SomeDynamicVariable + '.pdf',
    type: 'HEAD',
    error: function () {
        //file not exists
        alert('PDF does not exist');

    },
    success: function () {
        //file exists
        window.open('YourFolderOnWebsite/' + SomeDynamicVariable + '.pdf', "_blank", "fullscreen=yes");

    }
});

jQuery:

$.ajax({
    url:'http://www.example.com/somefile.ext',
    type:'HEAD',
    error: function()
    {
        //file not exists
    },
    success: function()
    {
        //file exists
    }
});

编辑:

下面是检查404状态的代码，不使用jQuery

function UrlExists(url)
{
    var http = new XMLHttpRequest();
    http.open('HEAD', url, false);
    http.send();
    return http.status!=404;
}

小的改变，它可以检查状态HTTP状态码200(成功)。

编辑2:由于sync XMLHttpRequest已弃用，你可以添加一个这样的实用方法来异步执行:

function executeIfFileExist(src, callback) {
    var xhr = new XMLHttpRequest()
    xhr.onreadystatechange = function() {
        if (this.readyState === this.DONE) {
            callback()
        }
    }
    xhr.open('HEAD', src)
}

我使用这个脚本来检查一个文件是否存在(它也处理交叉起源问题):

$.ajax(url, {
       method: 'GET',
       dataType: 'jsonp'
         })
   .done(function(response) { 
        // exists code 
    }).fail(function(response) { 
        // doesnt exist
    })

请注意，当检查的文件不包含JSON时，会抛出以下语法错误。

未捕获SyntaxError:意外的令牌<

由于缓存，所有其他答案都可能失败!

向服务器上的文件发出HTTP请求可以被HTTP缓存拦截，然后返回缓存的响应。但是在此期间，该文件可能会在服务器上被删除，因此忽略缓存可能会返回假阳性结果。

合适的解决方案是创建非缓存的HTTP HEAD请求。Nik Sumeiko的回答使用了无缓存头，这意味着响应可以被缓存，但在重用之前必须重新验证。在这种情况下，服务器可能会返回304:Not Modified，而不是200:OK，因此是假阴性。

为了避免缓存，正确的头是cache - control: no-store

文件可以在没有HTTP 200响应的情况下存在

您还应该记住，可能会发生重定向(301:永久移动，307:临时重定向或308:永久重定向)，因此文件可以存在于其他地方，并可能从不同的位置返回:根据用例，在这种情况下可以选择重定向而不是返回false。

另外请记住，如果您在不同的域上检查文件是否存在，并且它的CORS策略没有打开到您的服务器，后台请求将被阻止。在本例中，通常返回403:Forbidden，这并不意味着文件不存在，而是文件不可用。最后，同样适用于500:Internal Server Error响应，这意味着HTTP服务器未能处理请求，但该文件可以通过其他方式可用，例如通过FTP。

如果文件存在则返回true，如果不存在则返回false，如果文件不可用或重定向则返回undefined:

const fileExists = file =>
  fetch(file, {method: 'HEAD', cache: 'no-store'})
  .then(response => ({200: true, 404: false})[response.status])
  .catch(exception => undefined);

fileExists("yourFile.html").then(yes => yes && alert("yourFile.html exists"));

// or in the async scope...
let yourFileExists = await fileExists("yourFile.html");
if(yourFileExists) console.log("It is there!")
else if(yourFileExists===false) console.log("Nope, it was deleted.");
else console.log("You are not worthy the answer, puny human!");

现代和过时的方法

既然我们现在生活在未来，我还会建议:

$.ajax()过时，不要在新项目中使用 XMLHttpRequest()过时，不要在新项目中使用 Fetch()现代方法，如果您可以自由选择，请使用它

注意GET/POST方法(如<img src…>)在这里不合适，因为它们通过下载文件浪费了网络流量(想象一下高分辨率照片和用户在连接较差的地区使用付费移动数据的最坏情况)

注意:现代PWA方法是使用缓存API和serviceWorker的fetch事件来拦截客户端和HTTP缓存之间的通信。在链接中的例子中，应该有这样的东西

if(event.request.cache=="no-store") {
    // avoid cache storage and pass the request in the chain
    // client - cache storage - HTTP cache - server
    return fetch(event.request);
}

如果不这样做，缓存设置可能会被忽略，并且可能没有办法从运行serviceWorker的主线程中检测到远程文件的存在-如图所示 在这里。