JavaScript和CSS应该放在视图中吗？

Question

JavaScript和CSS应该放在视图中吗？

javascriptcssasp.net-mvcasp.net-mvc-views

4

我有一个ASP.NET MVC项目。我有一个_Layout，一个控制器和一些视图。其中一些代码显然是全局的。例如，_Layout CSS和整个站点通用的CSS肯定会放在全局CSS文件中。

但是，当样式和JavaScript特定于某个视图时，它们应该包含在.cshtml文件中还是应该放在全局文件中？

- user2102611

3

请注意，直接编写在“.cshtml”中的CSS和JS不会被捆绑和压缩。 - dee-see

1

通常不鼓励将内联的JS和CSS以及放置在.cshtml文件中的JS和CSS使用，因为a）它们不能像上面所述那样进行捆绑/缩小，b）通常不能缓存，并且c）使调试样式和JS错误变得更加困难，因为现在有多个地方需要检查/跟踪。 - Tommy

有时在 HTML 中添加少量的 JS/CSS 是有意义的，但它非常依赖于具体情况，并且需要考虑太多元素。你能详细解释一下你的情况吗？1）全局 JS/CSS 的数量；2）页面特定的 JS/CSS 数量；3）应用程序规模；4）服务器端硬件的能力；5）是否使用 CDN/代理？6）通常用户行为（比如单次使用需要浏览多少页）。 - tweray

3个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- softawareblog.com · Answer 1

通过这种方式，视图特定的资源被捆绑和压缩。

_Layout.cshtml:

<head>
    @Styles.Render("~/Content/mastercss")
    @Scripts.Render("~/bundles/masterjs")

    @RenderSection("header", required: false)
</head>

视图：

@{
    Layout = "~/Views/Shared/_Layout.cshtml";
 }

@section header{
    @Styles.Render("~/Content/viewspecific")
    @Scripts.Render("~/bundles/viewspecific")
}

捆绑包应该按需要它们的页面进行分区。例如，用于互联网应用程序的默认ASP.NET MVC模板创建了一个与jQuery分开的jQuery验证捆绑包。因为创建的默认视图没有输入并且不会发布值，所以它们不包括验证捆绑包。

http://www.asp.net/mvc/overview/performance/bundling-and-minification

- brainfood · Answer 2

所有视图共同的内容应该被包含在_Layout文件中。特定页面的自定义CSS和Javascript应该仅在该特定页面上加载。（不是直接编写，而是从不同的.js或.css文件呈现）

- mohammadreza berneti · Answer 3

你可以通过在布局中使用RenderSection来定义一个区域，然后在视图中这样使用它：

_Layout.cshtml :

<head>
<title>@ViewBag.Title</title>
<meta name="viewport" content="width=device-width" />
<script src="~/Content/Scripts/public.js"></script>
@RenderSection("head", false)
</head>

Post.cshtml :

@{
    Layout = "~/Views/Shared/_Layout.cshtml";
 }
@section head{
<script src="~/Content/Scripts/custom.js"></script>
}