在 ASP.NET 中管理您的 JavaScript 库






4.88/5 (97投票s)
了解如何将 JavaScript 嵌入 DLL、管理依赖项并避免页面膨胀。
引言
ASP.NET 开发者在管理 JavaScript 时通常会采取宽松的做法。我相信这是因为网上没有太多关于如何在 ASP.NET 应用程序中妥善处理 JavaScript 的可靠信息。本文旨在提出一种管理 ASP.NET 应用程序中 JavaScript 的最佳技术。将解决以下问题:
- 内联 JS - 将 JavaScript 直接放在页面中导致页面膨胀
- 部署 JS - 忘记部署 JavaScript 文件
- 错误的引用 - 在另一个 Web 应用程序中使用时,指向 JavaScript 的链接无效
- 依赖关系 - 需要记住 JavaScript 文件之间的依赖关系
- 未使用的 JS - 在未使用 JavaScript 的页面上引用 JavaScript
- HTTP / HTTPS - 从 HTTPS 页面引用 HTTP 上的 JavaScript
- 重构 - 为新版本重构可能需要一些时间
- 冗余 - 多次包含 JavaScript 文件
目录
- 必备组件
- 概述
- 入门
- 添加 JavaScript
- 嵌入 JavaScript 文件
- 包含嵌入的 JavaScript 文件
- 延迟加载
- 外部 JavaScript
- 添加新的 JavaScript 文件
- 排除 JavaScript
- VB.NET 用户须知
- 您获得了什么?
- 历史
必备组件
请确保您拥有 Visual Studio 2010。本文中介绍的一些概念可能不适用于 Express 版本。
概述
上述大多数问题都是由于将 JavaScript 或指向 JavaScript 文件的引用直接放在 ASPX 页面中引起的。几乎所有上述问题的解决方案是使用 ASP.NET 的内置功能将 JavaScript 文件嵌入到 DLL 中,然后动态引用这些文件。本文将介绍这些功能以及充分利用它们的一些技术。将使用教程格式来解释每个步骤的完成方式。
入门
首先。启动 Visual Studio 2010 并创建一个名为 `ParchmentPurveyor
` 的新空 Web 应用程序(我们正在为一位想销售高档纸张的人创建一个网站)
现在,添加一个名为“Default.aspx”的新 Web 窗体,并为其添加一些简单的 HTML。它应该看起来像这样
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs"
Inherits="ParchmentPurveyor.Default" %>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Parchment Purveyor</title>
</head>
<body>
<form id="form1" runat="server">
<h1>Parchment Purveyor</h1>
<p>Paper for printers, painting, publication,
paper planes, and plenty of other plebeian projects!</p>
</form>
</body>
</html>
添加 JavaScript
既然我们有了一个功能齐全的网站,肯定能吸引大量关注,我们可以专注于 JavaScript 编码。我们不会将 JavaScript 文件添加到主项目中,而是采取一种稍有不同的方式。我们将创建一个新项目来保存我们所有的 JavaScript 文件。首先添加一个名为 `JavaScriptLibrary
` 的新类库项目到解决方案中
当您添加该项目时,它会为您添加一个名为“Class1.cs”的文件。我们不需要它,所以将其删除。向 `JavaScriptLibrary
` 添加一个名为“JavaScript”的文件夹。您还将在此文件夹中添加两个 JavaScript 文件。将它们命名为“ShowMessage.js”和“GreetUser.js”。接下来,创建一个名为 `JavaScriptHelper
` 的新类(不要将其放在“JavaScript”文件夹中...它将放在 `JavaScriptLibrary
` 项目的根级别)。此时,您的解决方案结构应该如下所示:
几个空的 JavaScript 文件对我们没有好处,所以让我们在其中添加一些内容。首先,“ShowMessage.js”将包含一个名为 `ShowMessage()
` 的函数
function ShowMessage(msg) {
alert("Message From Website: " + msg);
}
“GreetUser.js”文件将拥有自己的函数,名为 `GreetUser()
`
function GreetUser() {
ShowMessage("Greetings and Salutations!");
}
请注意,`GreetUser()
` 依赖于 `ShowMessage()
`。我们稍后将处理这个问题。
嵌入 JavaScript 文件
我们希望将 JavaScript 文件嵌入到 DLL 中,而不是部署到我们的网站。这样,如果 DLL 被部署到网站,所有 JavaScript 文件也会被自动部署。这非常简单;我们只需要转到每个 JavaScript 文件的属性,然后将“构建操作”从“内容”更改为“嵌入的资源”
虽然这可以确保文件被嵌入到 DLL 中,但您仍必须使它们可供 Web 客户端使用。在此之前,`JavaScriptLibrary
` 项目需要引用 `System.Web
`
添加该引用后,编辑“JavaScriptHelper.cs”并添加以下 `using
` 语句和程序集属性
using System.Web.UI;
[assembly: WebResource("JavaScriptLibrary.JavaScript.ShowMessage.js",
"application/x-javascript")]
[assembly: WebResource("JavaScriptLibrary.JavaScript.GreetUser.js",
"application/x-javascript")]
这将使您的嵌入式 JavaScript 文件能够从客户端计算机访问。
包含嵌入的 JavaScript 文件
现在您已经嵌入了 JavaScript 文件并使其可以通过客户端计算机访问,您必须实际引用它们在使用的页面上。为了方便起见,我们将填充我们的 `JavaScriptHelper
` 类
using System;
using System.Web.UI;
[assembly: WebResource("JavaScriptLibrary.JavaScript.ShowMessage.js",
"application/x-javascript")]
[assembly: WebResource("JavaScriptLibrary.JavaScript.GreetUser.js",
"application/x-javascript")]
namespace JavaScriptLibrary
{
/// <summary>
/// Helps include embedded JavaScript files in pages.
/// </summary>
public class JavaScriptHelper
{
#region Constants
private const string NAME_SHOW_MESSAGE =
"JavaScriptLibrary.JavaScript.ShowMessage.js";
private const string NAME_GREET_USER =
"JavaScriptLibrary.JavaScript.GreetUser.js";
#endregion
#region Public Methods
/// <summary>
/// Includes ShowMessage.js in the page.
/// </summary>
/// <param name="manager">Accessible via Page.ClientScript.</param>
public static void Include_ShowMessage(ClientScriptManager manager)
{
IncludeJavaScript(manager, NAME_SHOW_MESSAGE);
}
/// <summary>
/// Includes GreetUser.js (and all dependencies) in the page.
/// </summary>
/// <param name="manager">Accessible via Page.ClientScript.</param>
public static void Include_GreetUser(ClientScriptManager manager)
{
// Dependency (ShowMessage.js).
Include_ShowMessage(manager);
// Include GreetUser.js.
IncludeJavaScript(manager, NAME_GREET_USER);
}
#endregion
#region Private Methods
/// <summary>
/// Includes the specified embedded JavaScript file in the page.
/// </summary>
/// <param name="manager">Accessible via Page.ClientScript.</param>
/// <param name="resourceName">The name used to identify the
/// embedded JavaScript file.
/// </param>
private static void IncludeJavaScript
(ClientScriptManager manager, string resourceName)
{
var type = typeof(JavaScriptLibrary.JavaScriptHelper);
manager.RegisterClientScriptResource(type, resourceName);
}
#endregion
}
}
`IncludeJavaScript()
` 函数是实现所有魔力的地方。它确保插入一个 `script
` 标签来指向一个嵌入的 JavaScript 文件,它通过调用 `RegisterClientScriptResource()
` 来实现。`IncludeJavaScript()
` 由 `Include_GreetUser()
` 调用。请注意,`Include_GreetUser()
` 也调用 `Include_ShowMessage()
`,这意味着它处理了类的用户的依赖关系。任何包含 `GreetUser()
` 函数的页面也将包含 `ShowMessage()
` 函数。
既然我们有了可供使用的类,让我们在“Default.aspx”页面上使用它。您可以先确保 `ParchmentPurveyor
` 引用了 `JavaScriptLibrary
`
接下来,我们需要修改代码隐藏以在页面中包含 JavaScript。
using System;
using System.Web.UI;
namespace ParchmentPurveyor
{
public partial class Default : System.Web.UI.Page
{
protected override void OnPreRender(EventArgs e)
{
base.OnPreRender(e);
JavaScriptLibrary.JavaScriptHelper.Include_GreetUser(Page.ClientScript);
}
}
}
最后,我们只剩下最后一件事要做了——从页面调用 `GreetUser()
` 函数。为此,我们只需将以下 JavaScript 添加到页面中(我选择将其添加到 `head
` 标签中)
<head runat="server">
<title>Parchment Purveyor</title>
<script type="text/javascript">
window.onload = function () { GreetUser(); };
</script>
</head>
就是这样!您完成了!嗯,差不多。还有一些小问题需要处理。不过,在我们解决这些问题之前,让我们先看看我们的劳动成果
这是您查看页面源代码时看到的 HTML 可能是什么样子(我已缩短并删除了一些值)
<html xmlns="http://www.w3.org/1999/xhtml">
<head><title>
Parchment Purveyor
</title>
<script type="text/javascript">
window.onload = function () { GreetUser(); };
</script>
</head>
<body>
<form method="post" action="Default.aspx" id="form1">
<div class="aspNetHidden">
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="..." />
</div>
<script src="/WebResource.axd?d=fslk3GLsk3Slek&t=1234" type="text/javascript">
</script>
<script src="/WebResource.axd?d=fglk3kSl3LS5&t=5678" type="text/javascript"></script>
<h1>Parchment Purveyor</h1>
<p>Paper for printers, painting, publication,
paper planes, and plenty of other plebeian projects!</p>
</form>
</body>
</html>
请注意,有两个 `script
` 标签引用了名为“WebResource.axd”的内容。这基本上是一个为客户端提供嵌入信息的服务。您可以在此处阅读有关“WebResource.axd”的更多信息。需要注意的重要一点是,第一个 `script
` 标签提供了 `ShowMessage()
` 函数,第二个 `script
` 标签提供了 `GreetUser()
` 函数。当您在 JavaScript 库中调用 `Include_GreetUser()
` 函数时,这两个 `script
` 标签都被包含在页面中。
延迟加载
有时,上述技术不包含 JavaScript 文件。例如,我使用一个第三方工具,该工具不允许我在渲染阶段之前调用 .NET 代码。当您在渲染阶段调用上面的包含函数时,`script
` 标签不会插入到页面中。这是因为页面的开头已经渲染为 HTML。我对此问题的解决方案是创建一个函数的备用形式,该函数在 HTML 的底部附近插入 `script
` 标签。我称之为“延迟加载”。我们可以通过对 `JavaScriptHelper
` 进行一些更改来支持此技术
using System;
using System.Web;
using System.Web.UI;
[assembly: WebResource("JavaScriptLibrary.JavaScript.ShowMessage.js",
"application/x-javascript")]
[assembly: WebResource("JavaScriptLibrary.JavaScript.GreetUser.js",
"application/x-javascript")]
namespace JavaScriptLibrary
{
/// <summary>
/// Helps include embedded JavaScript files in pages.
/// </summary>
public class JavaScriptHelper
{
#region Constants
private const string TEMPLATE_SCRIPT =
"<script type=\"text/javascript\" src=\"{0}\">
</script>\r\n";
private const string NAME_SHOW_MESSAGE =
"JavaScriptLibrary.JavaScript.ShowMessage.js";
private const string NAME_GREET_USER =
"JavaScriptLibrary.JavaScript.GreetUser.js";
#endregion
#region Public Methods
/// <summary>
/// Includes ShowMessage.js in the page.
/// </summary>
/// <param name="manager">Accessible via Page.ClientScript.</param>
/// <param name="late">Include the JavaScript at the bottom of the HTML?</param>
public static void Include_ShowMessage
(ClientScriptManager manager, bool late = false)
{
IncludeJavaScript(manager, NAME_SHOW_MESSAGE, late);
}
/// <summary>
/// Includes GreetUser.js (and all dependencies) in the page.
/// </summary>
/// <param name="manager">Accessible via Page.ClientScript.</param>
/// <param name="late">Include the JavaScript at the bottom of the HTML?</param>
public static void Include_GreetUser
(ClientScriptManager manager, bool late = false)
{
// Dependency (ShowMessage.js).
Include_ShowMessage(manager, late);
// Include GreetUser.js.
IncludeJavaScript(manager, NAME_GREET_USER, late);
}
#endregion
#region Private Methods
/// <summary>
/// Includes the specified embedded JavaScript file in the page.
/// </summary>
/// <param name="manager">Accessible via Page.ClientScript.</param>
/// <param name="resourceName">The name used to identify the
/// embedded JavaScript file.
/// </param>
/// <param name="late">Include the JavaScript at the bottom of the HTML?</param>
private static void IncludeJavaScript(ClientScriptManager manager,
string resourceName, bool late)
{
var type = typeof(JavaScriptLibrary.JavaScriptHelper);
if (!manager.IsStartupScriptRegistered(type, resourceName))
{
if (late)
{
var url = manager.GetWebResourceUrl(type, resourceName);
var scriptBlock = string.Format
(TEMPLATE_SCRIPT, HttpUtility.HtmlEncode(url));
manager.RegisterStartupScript(type, resourceName, scriptBlock);
}
else
{
manager.RegisterClientScriptResource(type, resourceName);
manager.RegisterStartupScript(type, resourceName, string.Empty);
}
}
}
#endregion
}
}
我修改了每个方法以接受一个额外的参数,即 `late
`。此参数默认为 `false
`,因此方法仍然可以像以前一样调用。值为 false
将保留旧行为。值为 true
将导致 `script
` 块包含在 HTML 的末尾附近。另请注意,在 `late
` 为 false
的情况下,我仍然调用 `RegisterStartupScript()
`,但传递了一个空的 string
(因此该函数调用实际上不会在 HTML 中插入任何内容)。这样做是为了让 `IsStartupScriptRegistered()
` 返回正确的值。这样,JavaScript 永远不会被包含多次,即使其中一个函数被调用时 `late
` 设置为 false
,然后再次调用时 `late
` 设置为 true
。如果您想看看效果,请注释掉代码隐藏中的 OnPreRender()
,并将页面的 body
修改为如下所示:
<body>
<form id="form1" runat="server">
<h1>Parchment Purveyor</h1>
<p>Paper for printers, painting, publication,
paper planes, and plenty of other plebeian projects!</p>
<% // This gets called during the render stage.
JavaScriptLibrary.JavaScriptHelper.Include_GreetUser
(Page.ClientScript, true); %>
</form>
</body>
这将调用在 HTML 底部附近包含 `script
` 标签的函数版本,当您运行应用程序并查看页面源代码时,您可以看到这一点。
外部 JavaScript
到目前为止,我只演示了如何包含嵌入的 JavaScript。但是,有时链接到外部 JavaScript 文件也是可取的。为了实现这一点,我们需要在 `JavaScriptHelper
` 中添加一个新的辅助函数
/// <summary>
/// Includes the specified external JavaScript file in the page.
/// </summary>
/// <param name="page">The current page.</param>
/// <param name="key">The name used to uniquely identify the external JavaScript file.
/// </param>
/// <param name="httpUrl">The URL of the external JavaScript file.</param>
/// <param name="httpsUrl">The URL of the external JavaScript file when SSL is enabled.
/// </param>
/// <param name="late">Include the JavaScript at the bottom of the HTML?</param>
private static void IncludeExternalJavaScript
(Page page, string key, string httpUrl, string httpsUrl, bool late)
{
var manager = page.ClientScript;
var type = typeof(JavaScriptLibrary.JavaScriptHelper);
bool isStartupRegistered = manager.IsStartupScriptRegistered(type, key);
bool isScriptRegistered = manager.IsClientScriptIncludeRegistered(type, key);
if (!(isStartupRegistered || isScriptRegistered))
{
string url;
if (page.Request.Url.Scheme.ToLower() == "http")
{
url = httpUrl;
}
else
{
url = httpsUrl;
}
if (late)
{
manager.RegisterStartupScript(type, key,
string.Format(TEMPLATE_SCRIPT, HttpUtility.HtmlEncode(url)));
}
else
{
manager.RegisterClientScriptInclude(type, key, url);
}
}
}
作为您可能包含的外部文件的示例,我将使用 Microsoft CDN 托管的 jQuery 文件。就像其他 JavaScript 文件一样,您将在 `JavaScriptHelper
` 中创建一个函数来在页面中包含 jQuery
private const string NAME_JQUERY = "jQuery";
private const string URL_JQUERY = "http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.5.1.js";
private const string URL_JQUERY_HTTPS =
"https://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.5.1.js";
/// <summary>
/// Includes jQuery.js in the page.
/// </summary>
/// <param name="page">The current page. Pass in null to get
/// the current page from the HTTP context.</param>
/// <param name="late">Include the JavaScript at the bottom of the HTML?</param>
public static void Include_jQuery(Page page, bool late = false)
{
if (page == null)
{
page = (Page)HttpContext.Current.Handler;
}
IncludeExternalJavaScript(page, NAME_JQUERY, URL_JQUERY, URL_JQUERY_HTTPS, late);
}
最后,您可以通过调用页面 `OnPreRender()
` 函数中的函数来包含 jQuery
protected override void OnPreRender(EventArgs e)
{
base.OnPreRender(e);
JavaScriptLibrary.JavaScriptHelper.Include_jQuery(Page);
JavaScriptLibrary.JavaScriptHelper.Include_GreetUser(Page.ClientScript);
}
如果您运行您的应用程序并查看页面源代码,您会看到 jQuery 被包含进来了
<script src=http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.5.1.js
type="text/javascript"></script>
添加新的 JavaScript 文件
设置好一切后,在添加新的 JavaScript 文件时,您只需要完成几个步骤
- 将“*.js”文件添加到“JavaScript”文件夹。外部 JavaScript 文件请跳过此步骤。
- 将“构建操作”设置为“嵌入的资源”。外部 JavaScript 文件请跳过此步骤。
- 添加程序集属性以指示 JavaScript 文件是 Web 资源。外部 JavaScript 文件请跳过此步骤。
- 在 `
JavaScriptHelper
` 中创建一个函数来包含您的 JavaScript 文件。 - 从页面、控件或母版页调用您刚刚创建的函数。
排除 JavaScript 文件
虽然您应该拥有包含 JavaScript 所需的一切,但有时您必须排除 JavaScript。例如,在处理可能以特殊方式包含 JavaScript 的第三方控件库时,防止某个 JavaScript 文件被包含两次的唯一方法可能是让您的代码避免包含它(然后让第三方库为您包含 JavaScript)。这可以通过另一个辅助函数来实现。不过,在我们开始之前,让我们演示一种可以使用此技术的场景。假设您的第三方控件包含 jQuery。此用户控件“InlineGreeting.ascx”将充当这样的控件
<%@ Control Language="C#" %>
<%-- This is a bad way to do things, but we can luckily overcome this obstacle. --%>
<script type="text/javascript"
src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.5.1.js">
</script>
<script type="text/javascript">
$(document).ready(function() {
$("#lblGreeting").text("Hello");
});
</script>
<p>
<label id="lblGreeting"></label>
</p>
现在假设我们有另一个控件“Hello.ascx”,它使用同一个 jQuery 文件
<%@ Control Language="C#" AutoEventWireup="true"
CodeBehind="Hello.ascx.cs" Inherits="ParchmentPurveyor.Hello" %>
<script type="text/javascript">
$(document).ready(GreetUser);
</script>
“Hello.ascx”的代码隐藏将包含 jQuery 以及我们的 JavaScript 来问候用户
protected override void OnPreRender(EventArgs e)
{
base.OnPreRender(e);
JavaScriptLibrary.JavaScriptHelper.Include_GreetUser(Page.ClientScript);
JavaScriptLibrary.JavaScriptHelper.Include_jQuery(Page);
}
现在,如果我们将在“Default.aspx”页面上同时包含这两个用户控件,jQuery 将被包含两次(一次由第三方控件包含,一次由我们的 JavaScript 库包含)。为了避免这种情况,我们将向我们的 `JavaScriptHelper
` 类添加两个函数:`ExcludeJavaScript()
` 和 `Exclude_jQuery()
`
private const string NAME_DUMMY_FILE = "JavaScriptLibrary.JavaScript.DummyFile.js";
/// <summary>
/// Excludes jQuery.js from the page.
/// </summary>
/// <param name="manager">Accessible via Page.ClientScript.</param>
public static void Exclude_jQuery(ClientScriptManager manager)
{
ExcludeJavaScript(manager, NAME_JQUERY);
}
/// <summary>
/// Registers a dummy script to prevent the inclusion of the real JavaScript.
/// </summary>
/// <param name="manager">Accessible via Page.ClientScript.</param>
/// <param name="key">The name used to uniquely identify the JavaScript file.</param>
private static void ExcludeJavaScript(ClientScriptManager manager, string key)
{
var type = typeof(JavaScriptLibrary.JavaScriptHelper);
var url = manager.GetWebResourceUrl(type, NAME_DUMMY_FILE);
manager.RegisterStartupScript(type, key, string.Empty);
manager.RegisterClientScriptInclude(type, key, url);
}
请注意,我们定义了一个新的常量 `NAME_DUMMY_FILE
`。上述函数假定我们已将一个空的 JavaScript 文件添加到“JavaScript”文件夹中,并按照上述说明进行了嵌入。这个空的虚拟 JavaScript 文件将被包含,以替换我们想要排除的任何 JavaScript 文件。我们唯一需要做的就是通过从“Default.aspx”的 `Page_Load()
` 中调用 `Exclude_jQuery()
` 来防止我们的库包含 jQuery。
// Page load occurs before pre-render (the ideal place to exclude JavaScript).
protected void Page_Load(object sender, EventArgs e)
{
// We have some third-party control that includes jQuery in a weird way,
// so we will avoid including it again.
JavaScriptLibrary.JavaScriptHelper.Exclude_jQuery(Page.ClientScript);
}
现在我们只需要修改“Default.aspx”以包含“InlineHello.ascx”和“Hello.ascx”,我们就完成了
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs"
Inherits="ParchmentPurveyor.Default" %>
<%@ Register Src="~/Hello.ascx" TagPrefix="greet" TagName="Hello" %>
<%@ Register Src="~/InlineGreeting.ascx" TagPrefix="greet" TagName="InlineHello" %>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Parchment Purveyor</title>
<script type="text/javascript">
// We are commenting this out while we use the jQuery version.
// window.onload = function () { GreetUser(); };
</script>
</head>
<body>
<form id="form1" runat="server">
<h1>Parchment Purveyor</h1>
<p>Paper for printers, painting, publication,
paper planes, and plenty of other plebeian projects!</p>
<% // This gets called during the render stage.
JavaScriptLibrary.JavaScriptHelper.Include_GreetUser
(Page.ClientScript, true); %>
<%-- An inline greeting (pretend this comes from a
third-party control library. --%>
<greet:InlineHello runat="server" />
<%-- Our jQuery greeting. --%>
<greet:Hello runat="server" />
</form>
</body>
</html>
既然我们已经确保在调用 `Include_jQuery()
` 之前调用了 `Exclude_jQuery()
`,我们就阻止了我们的 JavaScript 库包含“jQuery.js”。这样,jQuery 只被我们的模拟第三方控件包含一次。大多数情况下,这种情况应该可以避免。但是,对于不可避免的情况,此技术应该可以很好地整理我们的 HTML 输出。
VB.NET 用户须知
在制作 VB.NET 版本代码时,除语法差异外,几乎所有内容都与 C# 版本相同。但是,有一个重要的陷阱需要牢记。在 C# 版本代码中,您会注意到所有指向 JavaScript 文件的路径都以“JavaScriptLibrary.JavaScript
.”开头。然而,在 VB.NET 版本代码中,所有路径都只以“JavaScriptLibrary
.”开头(即,VB.NET 似乎忽略了所有 JavaScript 文件所在的“JavaScript”文件夹)。这要求 VB.NET 用户进行一些更改
<Assembly: WebResource("JavaScriptLibrary.ShowMessage.js", "application/x-javascript")>
<Assembly: WebResource("JavaScriptLibrary.GreetUser.js", "application/x-javascript")>
<Assembly: WebResource("JavaScriptLibrary.DummyFile.js", "application/x-javascript")>
Private Const NAME_SHOW_MESSAGE As String = "JavaScriptLibrary.ShowMessage.js"
Private Const NAME_GREET_USER As String = "JavaScriptLibrary.GreetUser.js"
Private Const NAME_DUMMY_FILE As String = "JavaScriptLibrary.DummyFile.js"
除此之外,我在让 VB.NET 代码正常工作时没有发现其他差异。如果您想自己尝试,可以通过文章顶部的链接下载 VB.NET 版本的代码。
您获得了什么?
在做了所有这些工作,但 HTML 输出看起来相同之后,您可能会问自己,“通过添加所有这些额外的代码,我到底获得了什么?”嗯,这里有一些这个方法提出的解决方案:
- 内联 JS - 通过避免将 JavaScript 库内联到页面中,您减少了页面膨胀。
- 部署 JS - 部署 Web 应用程序时,您无需包含“*.js”文件。部署 DLL 就足够了。
- 错误的引用 - 即使您更改了应用程序的路径,也不必担心更改 JavaScript 路径。
- 依赖关系 - 依赖关系自动管理。如果您包含“GreetUser.js”,则会自动包含“ShowMessage.js”。
- 未使用的 JS - 除非您调用函数来包含 JavaScript,否则不会将其包含在页面中。这将避免在页面上出现未使用的 JavaScript(可能加快用户的加载速度)。
- HTTP / HTTPS - 代码输出不包含协议的 `
script
` 标签,因此协议应与当前页面相同(即,HTTP 或 HTTPS)。 - 重构 - 如果您想使用脚本的另一个版本,只需在一个地方修改它即可。例如,如果您决定改用 CDN 版本的 jQuery 而不是自己托管,这将非常有用。升级到新版本的 jQuery 也可能很有用。
- 冗余 - 无论您调用包含函数多少次,`
script
` 标签都只会包含在页面中一次。
历史
- 2014-09-21: 修复了拼写错误
- 2011-11-10: 从 PRE 标签中删除了链接的 URL
- 2011-05-29: 修复了 Code Project 文章编辑器弄乱的 PRE 标签中的 URL
- 2011-05-25: 添加了 VB.NET 下载以及关于 VB.NET 版本的部分,并对 C# 下载进行了一些小的更改
- 2011-05-23: 修复了目录中的锚点标题,并添加了关于排除 JavaScript的部分
- 2011-05-21: 添加了目录
- 2011-05-16: 添加了关于链接到外部 JavaScript 文件的信息,并添加了对
HtmlEncode
的调用