如何判断 JavaScript 文件是否已包含在 ASP.NET 页面中？

Question

我有一个 ASP.NET 用户控件（.ascx 文件）。在这个用户控件中，我想使用一个 .js 文件。

所以我在页面上包含<script src="file.js" type"text/javascript"></script>。

但是，有时我在已加载相同脚本的网页中使用此用户控件。

如何添加 <script /> 声明，仅当页面尚未包含同一脚本的另一个 <script /> 标记时才会在页面上呈现？

Answer 1

当您使用 asp.net 时，检查服务器端是有意义的，因为您选择在其中添加对 javascript 文件的引用。从您的 .ascx 文件中，您可以注册以下内容：

this.Page.ClientScript.RegisterClientScriptInclude("GlobalUnqiueKey", UrlOfJavascriptFile);

...从您的页面中，您只需直接调用 ClientScript 对象：

ClientScript.RegisterClientScriptInclude("GlobalUnqiueKey", UrlOfJavascriptFile);

“GlobalUniqueKey”可以是任何字符串（我也使用 javascript 文件的 url）

如果您尝试使用相同的密钥字符串注册脚本，它不会执行任何操作。因此，如果您在您的页面、控件或其他任何地方调用它，您最终将在您的页面中只有一个引用。这样做的好处是您可以在页面上拥有多个控件实例，即使它们都尝试注册相同的脚本，但最多只能完成一次。而且他们都不需要担心脚本已经注册了。

有一个 'IsClientScriptIncludeRegistered(stringkey)' 方法，您可以使用它来查看脚本是否已包含在该键下，但在注册为多次尝试注册之前进行检查似乎非常多余，不要抛出异常或导致任何其他错误。

在客户端进行检查意味着，假设浏览器缓存了多个 javascript 引用（它们可能没有缓存），您仍然有多个标签，并且每个标签的开销都会导致一些 javascript 运行。如果您在一个页面上有 20 个控件实例，您可能会遇到严重的问题。

Answer 2

你可以在客户端做两件事之一......

1. 检查与您要检查的javascript文件对应的脚本标签的dom
2. 测试您知道已经/将在 javascript 文件中定义的变量或函数是否未定义。

这是一个快速的 JS 函数，它使用 JQuery 来做你需要的事情：

function requireOnce(url) {    
    if (!$("script[src='" + url + "']").length) {
        $('head').append("<script type='text/javascript' src='" + url + "'></script>"); 
    }
}

Answer 3

使用类似以下的内容：

if(typeof myObjectOrFunctionDecalredInThisScript != 'undefined') {
  // code goes here
  var myObjectOrFunctionDecalredInThisScript = { };
}

这会测试您的对象或函数是否已经存在，从而防止重新声明。

Answer 4

var storePath = [];
function include(path){
if(!storePath[path]){
    storePath[path]= true;
    var e = document.createElement("script");
    e.src = path;
    e.type = "text/javascript";
    document.getElementsByTagName("head")[0].appendChild(e);
    return false;
 } }

在您的主页中使用它并使用参数 javascript 文件名调用函数 include

Answer 5

因为您只想在网站的一页上包含 javascript。
如果你使用 Asp.net(4.0) 那就很简单了。
只需包含以下代码

<script type="text/javascript" scr="filepath and name here"></script>

在内容页面的ContentPlaceHolder 中。

Answer 6

@Shimmy 很长一段时间后我才遇到这个问题，但也许它仍然有用，或者至少可以帮助后面的其他人。要检查 jquery 是否已加载，请执行此操作

<script>window.jQuery || document.write('<script src="js/libs/jquery-1.x.x.min.js"><\/script>')</script>

不要错过 document.write 语句中结束脚本标记中的转义字符。

@mysomic，我怎么没想到。竖起大拇指

PS：我很想在@Shimmy 写下jQuery 本身就是他想要加载的脚本的那一行写下这个。但不知道如何在那里写。看不到回复或任何类似的链接。这可能听起来很愚蠢，但也许我错过了一些东西。请指出来，有人吗？

Answer 7

如果您从服务器端需要它，并且 Page.ClientScript.RegisterClientScriptInclude 对您不起作用，以防脚本通过 Page.ClientScript.RegisterClientScript 以外的其他方式包含（例如 page.Header.Controls.Add( ..)，你可以使用这样的东西：

static public void AddJsFileToHeadIfNotExists(Page page, string jsRelativePath)
{
    foreach (Control ctrl in page.Header.Controls)
    {
        if (ctrl is HtmlLink htmlLink)
        {
            if (htmlLink.Href.ToLower().Contains(jsRelativePath.ToLower())) return;
        }
        if (ctrl is ITextControl textControl
          && (textControl is LiteralControl || textControl is Literal))
        {
            if (textControl.Text.ToLower().Contains(jsRelativePath.ToLower())) return;
        }
        if (ctrl is HtmlControl htmlControl)
        {
            if (htmlControl.Attributes["src"]?.ToUpper()
              .Contains(jsRelativePath.ToUpper())) return;
        }
    }

    HtmlGenericControl Include = new HtmlGenericControl("script");
    Include.Attributes.Add("type", "text/javascript");
    Include.Attributes.Add("src", page.ResolveUrl(jsRelativePath));
    page.Header.Controls.Add(Include);    
}