Question

<script src="C:\Users\Admin\Downloads\jquery-3.1.1.js"></script>
<script src="C:/Users/Admin/Downloads/bootstrap-4.0.0-alpha.4/dist/js/bootstrap.js" type="text/javascript"></script>

<link rel="stylesheet" type="text/css" href="C:\Users\Admin\Downloads\bootstrap-4.0.0-alpha.4\dist\css\bootstrap.css">

我正在关注Bootstrap的Youtube教程，我已经下载了Bootstrap文件，CSS正在运行，但我认为js文件没有链接。

最初我没有链接js文件，并认为这是问题，但我已经链接它，它仍然不适合我（导航栏没有正确加载），格式出来所有搞笑

我如何链接JS文件有什么问题吗？

Answer 1

确保文件的路径正确，最佳做法是不使用绝对路径，但这样可以为您的问题提供临时解决方案

<script src="C:\Users\Admin\Downloads\jquery-3.1.1.js"></script>
    <script src="C:\Users\Admin\Downloads\bootstrap-4.0.0-alpha.4\dist\js\bootstrap.js" type="text/javascript"></script>


<link rel="stylesheet" type="text/css" href="C:\Users\Admin\Downloads\bootstrap-4.0.0-alpha.4\dist\css\bootstrap.css">

在此处详细了解绝对路径和相对路径Difference between Relative path and absolute path in javascript

Answer 2

请不要使用绝对路径，使用相对路径和正斜杠，以便你有这样的东西。

<script src="../{relativepath}/jquery-3.1.1.js"></script>
<script src="../{relativepath}/bootstrap.js" type="text/javascript"></script>
<link rel="styleshee

或者您可以将引导脚本移动到同一文件夹，以便您具有如下所示的结构。

+++ projectfolder
+++++ CSS
+++++ JS
++++++ jQuery的3.1.1.js
++++++ bootstrap.js
+++++的index.html

然后让你的css和js变成如下所示：

<script src="js/jquery-3.1.1.js"></script>
<script src="js/bootstrap.js" type="text/javascript"></script>
<link rel="styleshee

Answer 3

在大多数情况下，这不会奏效。如果使用绝对路径，则在将文件移出项目文件夹或生产环境中的权限问题时可能会遇到错误。虽然在某些情况下，我使用了绝对路径，例如使用自定义程序包使用保存在文件系统中的电子邮件模板。

但在您的情况下，您可能希望修改文件结构，如下所示：

- Project
  - lib
    - bootstrap
      - dist (and contents)
  - index.html

尝试使用这样的文件结构，并将dist文件夹从引导程序下载到lib文件夹中。之后，你可以像这样包括bootstrap：

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.js"></script>
<script src="./lib/bootstrap/dist/js/bootstrap.js" type="text/javascript"></script>


<link rel="stylesheet" type="text/css" href="./lib/bootstrap/dist/css/bootstrap.css">

或者，您可以将CDN用于某些软件包，但前提是它们可用。您也可能希望查找像bower和npm这样的包管理器，使开发应用程序变得更加容易。

Bootstrap JavaScript没有加载，我的代码出了什么问题？

3 个答案: