使用布局时如何在视图中添加脚本 src答案

【问题标题】：how to add script src inside a View when using Layout使用布局时如何在视图中添加脚本 src
【发布时间】：2012-12-26 10:06:54
【问题描述】：

我想包含一个 javascript 引用，例如：

<script src="@Url.Content("~/Scripts/jqueryFoo.js")" type="text/javascript"></script>

如果我有一个 Razor 视图，那么在无需将其添加到布局的情况下包含它的正确方法是什么（我只需要在单个特定视图中，而不是全部视图中）

在 aspx 中，我们可以使用内容占位符。我发现在 mvc 中使用 aspx 但不是 Razor 视图的较旧示例。

【问题讨论】：

只需将脚本标签添加到您的视图中。
我只想在我的视图中添加脚本，但是当我在创建的页面上查看源代码时，它会将脚本标签放在 html 的中，而不是 ?
对于较新的浏览器 type="text/javascript" 不需要

标签： asp.net-mvc razor

【解决方案1】：

您可以像我们在 asp.net 中使用的那样添加脚本标签，同时进行如下客户端验证。

@{
    ViewBag.Title = "Index";
}

<h2>Index</h2>
<script type="text/javascript" src="~/Scripts/jquery-3.1.1.min.js"></script>
<script type="text/javascript">
    $(function () {
       //Your code
    });
</script>

【讨论】：

对于更新的浏览器type="text/javascript" 不需要

【解决方案2】：

如果您使用的是 Razor 视图引擎，则编辑 _Layout.cshtml 文件。将页脚中的 @Scripts.Render("~/bundles/jquery") 移动到页眉部分，并根据需要编写 javascript / jquery 代码：

@Scripts.Render("~/bundles/jquery")
<script type="text/javascript">
    $(document).ready(function () {
        var divLength = $('div').length;
        alert(divLength);
    });
</script>

【讨论】：

【解决方案3】：

根据您想要实现它的方式（如果您需要脚本的特定位置），您可以在您的_Layout 中实现一个@section，这将使您能够从视图本身添加其他脚本，同时仍然保留结构体。例如

_布局

<!DOCTYPE html>
<html>
  <head>
    <title>...</title>
    <script src="@Url.Content("~/Scripts/jquery.min.js")"></script>
    @RenderSection("Scripts",false/*required*/)
  </head>
  <body>
    @RenderBody()
  </body>
</html>

查看

@model MyNamespace.ViewModels.WhateverViewModel
@section Scripts
{
  <script src="@Url.Content("~/Scripts/jqueryFoo.js")"></script>
}

否则，你所拥有的一切都很好。如果您不介意它与输出的视图“内联”，您可以将 <script> 声明放在视图中。

【讨论】：

顺便说一句，部分本质上是您所指的内容占位符。查看默认的 MVC Web 项目以及它们如何在页面上放置标题。
谢谢。这就是我一直在寻找的东西——但是没有 RenderSection 是否可以做到这一点？你说'你所拥有的很好' - 但我还没有任何东西......我尝试将脚本引用放在 .cshtml 的顶部，但结果是引用在但它们应该在头脑中
@dferraro: 然后您需要将RenderSection("Scripts") 添加到您的布局中（就像您将占位符一样），然后在视图中定义@section Scripts {}。在某些时候，对“主”（_layout）的修改迫在眉睫。您不能只在视图中定义某些内容并告诉它“为我将其放在 <head> 之间”（除非您想进入添加脚本的脚本）
+1。 @dferraro 更好的做法是将 jQuery 和 RenderSection 的引用放在之前，而不是放在头上。旧但相关的阅读：developer.yahoo.com/blogs/ydn/posts/2007/07/high_performanc_5
如果您的脚本不在Scripts 文件夹中，那么您可能还需要启用对它的访问：stackoverflow.com/questions/24763493/…