HTML 页面不会加载引用脚本

HTML page won't load reference scripts

本文关键字：加载 引用 脚本 HTML      更新时间：2023-09-26

我正在开发一个非常基本的HTML页面，该页面具有一些Javascript功能。没有什么花哨的，只是一些 DOM 操作。一切正常，然后所有脚本都神奇地停止工作。在查看Firebug时，似乎此脚本工作正常：

  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

然而，这两个引用似乎不再加载了：

  <script src="/Bootsrap/bootstrap.js" type="text/javascript"></script>
  <script src="custom.js" type="text/javascript"></script>

custom.js 位于根目录中，另一个位于 Bootstrap 文件夹中。昨天一切都很好，直到它不是，我无法让它再次工作。

function betterWork(this) {
  if(confirm("Is this your final selection?"))
  {
//  document.location = '#';
    $("#myModal").modal("show");
  }
}
function youCantDoThat() {
  alert("That isn't a Pokemon ya doof.");
}
function tooDamnBad() {
  var changeText = document.getElementById("textToChange");
  var newText = document.getElementById("newText");
  changeText.innerHTML = "Too Damn Bad!";
  newText.innerHTML = "Pick One Anyways :)";
}
.imageSize {
  width: 400px;
  height: 400px;
}
<!DOCTYPE html>
<html lang="en">
<head>
  <title>JS Project</title>
  <link rel="stylesheet" href="Bootstrap/bootstrap.css">
  <link rel="stylesheet" href="style.css" type="text/css">
</head>
<body>
  <div class="col-lg-12">
    <h1 class="text-center" id="textToChange">Pick A Starter Pokemon</h1>
    <h3 id="newText" class="text-center"></h3>
  </div>
  <div class="col-lg-12">
    <div id="img" onclick="betterWork()" class="imageSize col-lg-4">
      <img class="imageSize" src="http://assets19.pokemon.com/assets/cms2/img/pokedex/full//001.png" />
    </div>
    <div id="img" onclick="betterWork()" class="imageSize col-lg-4">
      <img class="imageSize" src="http://vignette3.wikia.nocookie.net/pokemon/images/1/13/007Squirtle_Pokemon_Mystery_Dungeon_Explorers_of_Sky.png/revision/latest?cb=20150105230449" />
    </div>
    <div id="img" onclick="betterWork()" class="imageSize col-lg-4">
      <img class="imageSize" src="http://static.giantbomb.com/uploads/scale_small/0/6087/2438704-1202149925_t.png" />
    </div>
    <div id="img3" onmouseover="youCantDoThat()" class="imageSize col-lg-4">
      <img class="imageSize" src="http://41.media.tumblr.com/c38fff03b8dd7aaf75037eb18619da57/tumblr_n436i3Falo1sndv3bo1_1280.png" />
    </div>
    <div id="img4" onclick="betterWork()" class="imageSize col-lg-4">
      <img class="imageSize" src="http://assets.pokemon.com/assets/cms2/img/pokedex/full/010.png" />
    </div>
    <div id="img5" onclick="betterWork()" class="imageSize col-lg-4">
      <img class="imageSize" src="http://vignette2.wikia.nocookie.net/camphalfbloodroleplay/images/7/77/Pikachu.png/revision/latest?cb=20141004224742" />
    </div>
    <br />
    <div class="text-center">
      <button type="button" class="btn btn-info btn-lg" onclick="tooDamnBad()">I Don't Like These Pokemon</button>
    </div>
  </div>
  <footer></footer>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
  <script src="/Bootsrap/bootstrap.js" type="text/javascript"></script>
  <script src="custom.js" type="text/javascript"></script>
</body>
</html>

诊断脚本未加载的原因应从打开控制台开始，查看"资源"选项卡，并确定浏览器是否以及为什么加载脚本时出错。

或者，您可以直接从浏览器打开脚本，您的网页会通知您。例如，如果脚本位于路径/Bootstrap/bootstrap.js，并且主机名为 localhost ，请导航到 localhost/Bootstrap/boostrap.js 。

解释结果：

  • 如果结果是403错误，则表示您的Web服务器无法打开此文件。您需要授予read对网络服务器的访问权限。
  • 如果结果是404错误，则意味着该文件实际上不在指定的路径处。您将需要逐步调试并找出原因。如果需要，其他堆栈溢出问题可能会解决此问题。
  • 如果结果是不同的错误，则可以用谷歌搜索其含义，您可以发表评论并要求进一步澄清
相关文章：