我需要仅将 css 和脚本加载到特定的部分视图，但此时此链接和脚本已加载到所有视图中。我的结构是主视图嵌入了 _Layout 和标题，标题嵌入了一个名为 SearchHeader 的部分视图。
_Layout -> View <- Header <- SearchHeader
标题：
<li id="_Header_Menu">
<div>
<ul class="sf-menu">
<li>
@Html.Partial("../Home/SearchHeader")
</li>
</ul>
</div>
</li>
搜索标题：
<html>
<head>
<link href="@Url.Content("~/Content/fonts")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("../../Content/GlyphIcons.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("../../Content/bootstrap.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("../../Content/bootstrap.min.css")" rel="stylesheet" type="text/css" />
</head>
<body>
<input type="text" name="contentToSearch" class="form-control" id="contentToSearch" placeholder="Search">
<script src="@Url.Content("../../Scripts/boostrap.min.js")" type="text/javascript"></script>
<script src="@Url.Content("../../Scripts/jquery.js")" type="text/javascript"></script>
</body>
</html>
css 和脚本加载正确，但应用于Header view. 如何只适用于SearchHeader view？
如果不应用于整个页面，则无法专门为部分视图加载 CSS 和 JavaScript 资源。因此，您需要设计页面样式或 JavaScript 以仅针对相关部分。
<div id="header-section">
<ul class="menu">
...
<li>@Html.Partial("SearchHeader")</li>
</ul>
</div>
...
<div id="search-header">
<ul class="menu">...</ul>
</div>
如果我想采用ul.menu不同的样式，我会使用选择器规则
JavaScript
$("#header-section > .menu").css({ ... });
$("#search-header > .menu").css({ ... });
或者在 CSS 文件中
#header-section > .menu { ... }
#search-header > .menu { ... }
或者只使用不同的类或特定的 id
<div class="header-only"></div>
<div class="search-header-only"></div>
<div id="special-item"></div>
.header-only { font-size: 1em; }
.search-header-only { font-size: 0.85em; }
#special-item { font-size: 1.5em; }