如何在 ASP.NET 项目中正确引用 JavaScript 文件？答案

【问题标题】：How to Properly Reference a JavaScript File in an ASP.NET Project?如何在 ASP.NET 项目中正确引用 JavaScript 文件？
【发布时间】：2011-01-31 08:34:59
【问题描述】：

我有一些页面引用了 javascript 文件。

应用程序本地存在于虚拟目录中，即http://localhost/MyVirtualDirectory/MyPage.aspx

所以我在本地引用文件如下：

<script src="/MyVirtualDirectory/Scripts/MyScript.js" type="text/javascript"></script>

但生产设置有所不同。该应用程序在生产中作为其自己的网站存在，因此我不需要包含对虚拟目录的引用。这样做的问题是我需要修改每个包含 javascript 引用的文件，使其如下所示：

<script src="../Scripts/MyScript.js" type="text/javascript"></script>

我已尝试在本地设置中以这种方式引用文件，但它不起作用。

我这样做完全错了吗？谁能告诉我我需要做什么？

谢谢

【问题讨论】：

是否有一些代码 sn-ps 没有通过？
重复？ stackoverflow.com/questions/937779/…
@Boj，这不是重复的 - 你指的那个问题是 ASP.NET MVC
通常我会为我的本地站点添加主机头，所以不是像 localhost/MyVirtualDirectory 这样的 url，而是像 dev.myvirtualdirectory.com 这样的东西。在这种情况下，您可以避免 url 上的差异

标签： asp.net javascript virtual-directory

【解决方案1】：

使用 ResolveUrl("~/")

<script src="<%=ResolveUrl("~/scripts/myscript.js") %>" type="text/javascript"></script>

~/ 将为您提供应用程序的根目录，无论是虚拟的还是其他的

【讨论】：

@DaveDev 将 ~/ 用于所有资源可能是个好主意； javascript、样式表、图像等......它将为您省去很多麻烦
不过，他的第二个示例将Scripts 作为他的应用程序目录的对等级别，而不是它的子目录，不是吗？毕竟它以../ 开头...而在他的第一个示例中，Scripts 显然是应用程序根目录的子目录，因此这将起作用（尽管它似乎没有必要；它可以只是一个没有服务器端的相对路径完全需要解析）。当然，他确实说第二个例子不起作用。 :-)
@TJ 我认为他假设他必须导航回“../”，因为他不再拥有生产环境中的虚拟目录
如果Scripts 始终是应用程序的子目录，则过于复杂。只需使用相对路径，无需任何服务器端解析。

【解决方案2】：

Previous answers 似乎假定Scripts 目录始终作为应用程序根目录的子目录存在。如果该假设是正确的，并且页面也在根目录，那么您之前的两个标签都可以简单地：

<script src="Scripts/MyScript.js" type="text/javascript"></script>

但我对您的第二个示例的阅读是 Scripts 不是始终是应用程序根目录的子目录（因为开头的 ../ 向上移动了一个级别，所以 Scripts将是您的应用程序根的对等方）。也就是说，您确实说第二个示例不起作用。 :-) 但如果确实如此，我强烈建议调整一个环境或另一个环境，以使相对路径一致，然后始终使用上述相对路径。

据我所知，使用ResolveUrl 的唯一原因是应用程序中的页面是否位于文件夹结构中，并且标签可能出现在根目录的页面中或“子目录”中的页面中。如果是这样，您可以在两种情况下都使用ResolveUrl，这样您就有了一个锚点。我从不这样创作，我总是确保我知道页面在层次结构中的位置（如果需要有层次结构）并为当前文档使用适当的相对路径。

【讨论】：

- 仅当页面位于站点的根目录时才有效？
@Hunter：不，它是当前文档位置的相对路径。如果要从站点的根目录开始，它将以斜杠 (/) 开头。
@TJ 但如果我在“/myfolder/index.html”，那么“scripts/myscripts.js”将解析为“/myfolder/scripts/myscripts.js”，对吗？跨度>
@Hunter：是的，它是一个相对路径。
感谢@Hunter，他的解决方案奏效了，我选择了它作为正确答案。但由于这是我正在寻找的更具体的内容，而且更直接，我必须选择这个作为接受的答案。谢谢@Hunter 和@T.J.

【解决方案3】：

您可以使用 HttpRuntime.AppDomainAppVirtualPath 属性来获取您的应用程序的虚拟路径（如果有）并使用它来修复 javascript 路径（在

您可以在母版页中进一步添加一个全局 javascript 变量，该变量也公开该值，以便任何需要知道实际应用根目录的脚本都可以通过这种方式访问它。

【讨论】：

【解决方案4】：

MVC5 中的另一种方式：

1）在布局的html视图文件中，将RenderSection放在你需要脚本所在的地方：

<html><body>
@RenderSection("scripts1", required: false)
</body></html>

请注意，您可以将“Scripts1”更改为您喜欢的任何名称。

2）在你的视图html文件中，只要调用“scripts1”，不管在哪里，用你的路径和js文件名：

@Scripts1.Render("~/Scripts/MyScript.js")

3) 确保 MyScript js 文件位于项目的 Scripts 文件夹中。

就是这样。

【讨论】：

为什么要降级？这个解决方案在我的 ASP.NET 项目中对我有用。这是一个很好的解决方案，可以避免两次调用相同的“MyScript.js”。假设我们的布局必须有子视图：view1.html、view2.html，并且它们每个都需要调用，使用我的方式将只有 1 个调用而不是 2 个调用。