javascript - 在部分 View 中包含 JavaScript 文件

标签 javascript jquery asp.net-mvc partial-views

我想知道在部分 View 中包含 javascript 文件的最佳做法是什么。一旦呈现,这将最终成为我页面 html 中间的 js 包含标记。从我的 Angular 来看,这不是一个很好的方法。它们属于 head 标签,因此不应阻止浏览器一次性呈现 html。

一个例子: 我在“PictureGallery”部分 View 中使用了一个 jquery 图片库插件,因为这个部分 View 将在多个页面上使用。只有在使用此 View 时才需要加载此插件,我不想知道每个局部 View 正在使用哪些插件...

感谢您的回答。

最佳答案

似乎与这个问题非常相似:Linking JavaScript Libraries in User Controls

我将在此处重新发布我对该问题的回答。

出于您提到的原因,我肯定会建议不要将它们放在部分中。一个 View 很有可能会引入两个部分,这两个部分都引用了同一个 js 文件。在加载其余 html 之前加载 js 也会对性能造成影响。

我不知道最佳实践,但我选择在母版页中包含任何常见的 js 文件,然后为特定于特定或少量 View 的一些额外的 js 文件定义一个单独的 ContentPlaceHolder。

这是一个示例母版页 - 它非常容易解释。

<%@ Master Language="C#" Inherits="System.Web.Mvc.ViewMasterPage" %>
<head runat="server">
    ... BLAH ...
    <asp:ContentPlaceHolder ID="AdditionalHead" runat="server" />
    ... BLAH ...
    <%= Html.CSSBlock("/styles/site.css") %>
    <%= Html.CSSBlock("/styles/ie6.css", 6) %>
    <%= Html.CSSBlock("/styles/ie7.css", 7) %>
    <asp:ContentPlaceHolder ID="AdditionalCSS" runat="server" />
</head>
<body>
    ... BLAH ...
    <%= Html.JSBlock("/scripts/jquery-1.3.2.js", "/scripts/jquery-1.3.2.min.js") %>
    <%= Html.JSBlock("/scripts/global.js", "/scripts/global.min.js") %>
    <asp:ContentPlaceHolder ID="AdditionalJS" runat="server" />
</body>

Html.CSSBlock 和 Html.JSBlock 显然是我自己的扩展,但同样,它们的作用是不言自明的。

然后说我会拥有一个 SignUp.aspx View

<asp:Content ID="signUpContent" ContentPlaceHolderID="AdditionalJS" runat="server">
    <%= Html.JSBlock("/scripts/pages/account.signup.js", "/scripts/pages/account.signup.min.js") %>
</asp:Content>

HTHs,查尔斯

附言。这是我询问的关于缩小和连接 js 文件的后续问题: Concatenate & Minify JS on the fly OR at build time - ASP.NET MVC

编辑:按照我的其他回答的要求,我按照要求实现了 .JSBlock(a, b)

public static MvcHtmlString JSBlock(this HtmlHelper html, string fileName)
{
    return html.JSBlock(fileName, string.Empty);
}

public static MvcHtmlString JSBlock(this HtmlHelper html, string fileName, string releaseFileName)
{
    if (string.IsNullOrEmpty(fileName))
        throw new ArgumentNullException("fileName");

    string jsTag = string.Format("<script type=\"text/javascript\" src=\"{0}\"></script>",
                                 html.MEDebugReleaseString(fileName, releaseFileName));

    return MvcHtmlString.Create(jsTag);
}

然后魔法发生的地方......

    public static MvcHtmlString MEDebugReleaseString(this HtmlHelper html, string debugString, string releaseString)
    {
        string toReturn = debugString;
#if DEBUG
#else
        if (!string.IsNullOrEmpty(releaseString))
            toReturn = releaseString;
#endif
        return MvcHtmlString.Create(toReturn);
    }

关于javascript - 在部分 View 中包含 JavaScript 文件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/912755/

相关文章:

jquery - PartialView 和不显眼的客户端验证不起作用

asp.net-mvc - 如何使用 ASP.NET MVC 在请求之间保留对象?

javascript - 当我使用 Vue.JS 时,为什么 Microsoft Edge 无法识别 "this*"指向对象的指针?

javascript - Gulp dist 构建优化

javascript - Evernote JS SDK - 能否构造 NoteFilter 来过滤不包含 tagGUID 列表的笔记?

php - 我想在 $.post 中实时更新而不重新加载或刷新

javascript - Jquery 插件对象 #<HTMLDocument> 没有方法 'observe' 问题

javascript - 在向下箭头键光标进入包含图像的 div 内

asp.net-mvc - ASP.NET MVC中的Razor页面生命周期

javascript - 如何在移动设备上禁用scrollify.js