Question

如何检查文件夹中是否存在.html文件？我试图不接收错误＆＃34;它可能已被移动或删除。＆＃34;而是显示notFound.html

<body>
    <header>    
        <form autocomplete="off">
            <input id="3Digits" type="number" min="100" placeholder="3-Digit Code">
            <span style="display:inline-block; width: 15px;"></span>
            <a href="#" id="goButton" onclick="check()">Go</a>
            <hr>
        </form>
    </header>
    <div id="frameDiv">
        <iframe id="srcCC"></iframe>
    </div>
    <script>
        var newLink
        function check() {
        newLink = document.getElementById("3Digits").value + ".html";
            if(newLink == ".html") {
                alert("You forgot to put the 3-Digit Code");
            }
            else {
                LinkCheck(newLink);
            }
        }
        function LinkCheck(url) {

            if(HTML EXISTS) {
                document.getElementById("frameSRC").src = newLink;
            }
            else {
                document.getElementById("frameSRC").src = "notFound.html";
            }
        }
    </script>
</body>

LinkCheck功能是我要求的，所有文件都将在同一目录中。这是一个小型的学校项目，所以任何帮助将不胜感激！

Answer 1

您可以使用XMLHttpRequest检查文件是否存在

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

Answer 2

用以下功能替换您的功能：

function LinkCheck(url) {
  var xhr = new XMLHttpRequest();
  xhr.open("GET", url, true);
  xhr.onload = function(e) {
    if (xhr.readyState === 4) {
      if (xhr.status === 200) {
        document.getElementById("frameSRC").src = newLink;
      } else {
        document.getElementById("frameSRC").src = "notFound.html";
      }
    }
  };
  xhr.send(null);
}

选项2：使用jQuery ajax

    function LinkCheck(url) {
      $.ajax({
        url: url,
        success: function(data) {
          document.getElementById("frameSRC").src = newLink;
        },
        error: function(data) {
          document.getElementById("frameSRC").src = "notFound.html";
        },
      })
    }

Answer 3

尝试将此功能替换为LinkCheck：

function LinkCheck(url) {

  const http = new XMLHttpRequest();
  http.onreadystatechange = function() {

    if (this.readyState === 4 && this.status === 200) { // if (HTML EXISTS) 
      document.getElementById("frameSRC").src = newLink;
    } else {
      document.getElementById("frameSRC").src = "notFound.html";
    }
  }

  http.open('get', url, true);
  http.send();

}

如果说有些弃用问题请尝试使用新的javascript本机提取API：

function LinkCheck(url) {

  fetch(url).then(function(response) {
    if (response.status === 200) {
      document.getElementById("frameSRC").src = newLink;
    } else {
      // this else isn't needed but you can put it here or in the catch block
      document.getElementById("frameSRC").src = "notFound.html";
    }
  })
  .catch(function (err) {
    throw err;
  });  
}

Javascript检查是否存在html文件

3 个答案: