<script> src 属性中的 ./ 和 / 有区别吗？

Question

给定以下项目结构：

/root
  /static
    script.js
  page.html

这会将“导入”script.js，导入HTML文件：

<html>
    <head>
        <script src="/static/script.js"></script>
    </head>
    <body>
        ...
    </body>
</html>

这也将：

<html>
    <head>
        <script src="./static/script.js"></script>
    </head>
    <body>
        ...
    </body>
</html>

我在想：

一种方式优于另一种方式吗？
在 / 和 ./ 中，<script> 的 src 属性有什么不同的情况吗？

Answer 1

./ 是一个相对路径或将提供您的资产的当前目录。

/ 是一个绝对路径或根路径，您的资产将从那里得到服务。

Answer 2

现在，我在 JavaScript 方面不是很有经验，但我会告诉你我所知道的。

[...]
<script src="./static/script.js"></script>
[...]
<!--This would reference files in the current folder (where the webpage itself is stored)-->

[...]
<script src="/static/script.js"></script>
[...]
<!--This would reference an absolute path within your webserver, and cannot change dynamically based on from where you load it.-->

一般来说，当您从当前文件夹（and/or 服务器）中的文件加载它时，我会选择 ./，而 / 似乎是外部参考对我来说，这也不是动态的。如果你碰巧移动了文件（如果它和你的页面在同一个目录），我想 JavaScript 也会引用新文件而不是抱怨旧文件。

我不能保证上面的任何信息都是正确的，因为我不是一个很好的人JS-Developer，但至少这应该能帮助你更多地理解语法。

Answer 3

./是链接到当前目录的相对路径。

/是链接到根目录的绝对路径

您可以找到更多信息here。

Answer 4

是的，两者是不一样的。您无法看到 index.html 已经在您的根目录中。如果目录中有 .html 文件。然后你就可以看出区别了。

./ 这给出了您正在访问的文件的相对路径

如果这是目录结构

/root
 /static
  script.js
 /page
  index.html

然后，您将无法使用 ./，因为它不会在 page 文件夹

中找到 script 文件夹

所以，如果你有一个复杂的目录结构，使用 ./ 即 relative 路径，如果你有一个简单的结构 / 即 absolute 路径会很好。为了更好的实践，相对路径优于绝对路径。希望，这回答了你的问题。

<script> src 属性中的 ./ 和 / 有区别吗？

Is there any difference between ./ and / in <script> src attribute?

javascript

html

path

filepath

src