Javascript jQuery检查本地是否存在文件

我正在为一家公司开发一个本地站点（仅限本地内部使用，离线且无服务器）。我有一个主页，它有一个主div，其中包含3个不同的div。每个div链接到一个页面，每个div的“onclick”事件将加载链接到主div的页面。因此，我必须使用document ready函数检查每个页面是否存在，如果不存在，我想删除链接到该页面的div。如何检查本地是否存在页面？我发现很多Answare都会检查页面是否存在连接状态，但我的html只能脱机和本地工作，所以我不能使用这种方法

编辑-已解决

我用@che azeh的脚本解决了这个问题：

function checkIfFileLoaded(fileName) {
    $.get(fileName, function(data, textStatus) {
        if (textStatus == "success") {
            // execute a success code
            console.log("file loaded!");
        }
    });
}

---

如果文件加载成功，我会更改一个新的隐藏div的内容，该div将告诉另一个脚本是否必须删除三个div中的每一个。您可以尝试在

try catch

构造中加载页面。如果该页面存在，则将加载该页面。如果没有，您可以（在

catch

中）将相关div设置为

hidden

尝试使用

$.ajax

访问页面。使用

错误：

选项运行回调函数，删除链接到页面的DIV

$.ajax({
    url: "page1.html",
    error: function() {
        $("#page1_div").remove();
});

---

您可以在所有div上循环此代码。

我建议您在客户端计算机上运行一个本地web服务器。（另请参见下面关于本地XHR访问的编辑）

使用本地web服务器，他们可以像启动应用程序一样启动它。例如，您可以使用节点的

http服务器

。您甚至可以将其安装为node/npm包，这也使得部署更加容易

通过使用适当的http服务器（在您的情况下是本地的），您可以使用xhr请求：

$(function(){
    $.ajax({
        type: "HEAD",
        async: true,
        url: "http://localhost:7171/myapp/somefile.html"
    }).done(function(){
        console.log("found");
    }).fail(function () {
        console.log("not found");
    })
})

编辑： 火狐 另一篇帖子（@che azeh）让我注意到firefox确实允许在文件“协议”上使用XHR。在撰写本文时，上述内容在firefox中使用的是

url

，即

somefile.html

，并使用文件模式

铬 Chrome有一个选项允许从文件（）访问文件。这也允许本地XHR请求 此标志用于测试目的：

您应该能够在Google Chrome中运行测试，而不会遇到任何麻烦

---

我仍然建议使用本地web服务器，因为这样可以使您独立于这些浏览器标志，并且在firefox/chrome决定禁用对其的支持后，可以保护您不受回归的影响。

此功能检查文件是否可以成功加载。您可以使用它来尝试加载本地文件：

function checkIfFileLoaded(fileName) {
    $.get(fileName, function(data, textStatus) {
        if (textStatus == "success") {
            // execute a success code
            console.log("file loaded!");
        }
    });
}
checkIfFileLoaded("test.html");

---

您可以使用jquery

load

函数

$("div").load("/test.html", function(response, status, xhr) {
  if (status == "error") {
    var msg = "Sorry but there was an error: ";
    $(this).html(msg + xhr.status + " " + xhr.statusText);
  }
});

---

---

我解释错了，准备编辑。编辑。我不能使用try-catch构造：这样做，存在的页面将在单击该div之前加载到我的主div中。OP必须在

try-catch

中放置什么？加载页面是异步的，您无法捕获

try-catch

的错误。oops。。。你说得对@Barmar。不过，也可以用承诺来代替，但遵循同样的概念。脱机意味着没有互联网连接，那么你只能检查本地web服务器上的文件&而不是外部世界的文件。我没有本地web服务器。这是一个本地站点。我在目录中有html页面，就像它们是.txt文件一样。没有web服务器，没有连接，什么都没有。我只使用与绝对路径链接的页面您的意思是您正在浏览器中使用类似

URL的URL运行该文件file:///C:/xxx/xxx/fileCheck.html

或者怎么做？是的，没错。我得检查一下file:///C:/xxx/xxx/page2.html 存在但你的公司会在网络服务器上运行，他们不会像那个URL那样访问？他是在用URL访问文件，就像

file:///C:/xxx/xxx/fileCheck.html

，我怀疑ajax调用是否会像那样进行？'$（document）.ready（function（）{$.ajax（{url:“artisan.html”，错误：function（）{$（“#div_artisan”）.remove（）；}）；“像这样吗？有一个网站正在使用服务器运行，但他们希望我在没有服务器的情况下也这样做，因为导航更好，并且在这里使用服务器时存在问题。是的，因此我建议您运行WEB（节点）本地计算机上的服务器以及使用

http://localhost/etc

我不能在这里解释，但我真的不能使用任何类型的服务器好的，但你知道我说的不是计算机中的远程服务器，对吧？我只是指在客户端机器上本地运行的应用程序，为你的web应用程序服务，而不是外部应用程序网络等（只是确保你明白我的意思；）是的，我明白了，但领导希望我不使用任何类型的服务器。我将尝试在一个隐藏的分区中使用try-catch结构。它可以工作吗？工作！谢谢！我必须检查它是否失败，所以我只需要用（textStatus！=“success”）更改（textStatus=“success”）.@FedericoPessina在chrome上试一试吗？@techie_28Firefox@FedericoPessina我建议你在谷歌Chrome上运行这个程序。你可以尝试用一个类似的机制来实现一个

promise

，在promise完成后会返回成功或失败。我认为这应该适用于所有浏览器。