遇到的困难

在ASP .NET MVC里面，会使用_Layout.cshtml来绘制一些全局的公共页面，以及引用相关的css和js
而在每个独立的页面中，也有自己独立的js
一般来说，希望公共的js放在独立的js之前
css同理

作法

方案1

使用@RenderSection-@section XXX的方法
在_Layout.cshtml里定义一个放置@section里面内容的地方，再在独立页面中使用@section XXX放置相关引用
保证XXX名字相同，则加载的时候，会放置到_Layout.cshtml的对应位置
下面例子中定义了"Styles"和"Scripts"两个section，展示了"Scripts"的使用
_Layout.cshtml

<!DOCTYPE html>

<html>

<head id="Head1">

    <title>

    </title>

    <link href="~/css/common/style.css" rel="stylesheet" type="text/css">

    <link href="~/lib/kkpager/kkpager_orange.css" rel="stylesheet" type="text/css">

    <link href="~/lib/swiper/dist/css/swiper.min.css" rel="stylesheet" type="text/css">

    <link href="~/lib/layer/theme/default/layer.css" rel="stylesheet" type="text/css">

    @RenderSection("Styles", required: false)

</head>

<body>

    @RenderBody()

    <script type="text/javascript" src="~/js/common/jquery.js"></script>

    <script type="text/javascript" src="~/lib/angular/angular.min.js"></script>

    <script type="text/javascript" src="~/lib/kkpager/kkpager.min.js"></script>

    <script type="text/javascript" src="~/lib/swiper/dist/js/swiper.min.js"></script>

    <script type="text/javascript" src="~/lib/layer/layer.js"></script>

    <script type="text/javascript" src="~/js/common/common.js"></script>

    <script type="text/javascript" src="~/js/common/jquery.jslides.js"></script>

    @RenderSection("Scripts", required: false)

</body>

</html>

独立页面中，这样写

@section Scripts

{

    <!--这里的内容会放置在@RenderSection("Scripts", required: false)的位置-->

    <script type="text/javascript" src="~/js/news/index.js"></script>

}

方案2（不推荐）

把公共的js放在Head里面，像这样

<!DOCTYPE html>

<html>

<head id="Head1">

    <title>

    </title>

    <link href="~/css/common/style.css" rel="stylesheet" type="text/css">

    <link href="~/lib/kkpager/kkpager_orange.css" rel="stylesheet" type="text/css">

    <link href="~/lib/swiper/dist/css/swiper.min.css" rel="stylesheet" type="text/css">

    <link href="~/lib/layer/theme/default/layer.css" rel="stylesheet" type="text/css">

    <script type="text/javascript" src="~/js/common/jquery.js"></script>

    <script type="text/javascript" src="~/lib/angular/angular.min.js"></script>

    <script type="text/javascript" src="~/lib/kkpager/kkpager.min.js"></script>

    <script type="text/javascript" src="~/lib/swiper/dist/js/swiper.min.js"></script>

    <script type="text/javascript" src="~/lib/layer/layer.js"></script>

    <script type="text/javascript" src="~/js/common/common.js"></script>

    <script type="text/javascript" src="~/js/common/jquery.jslides.js"></script>

    @RenderSection("Styles", required: false)

</head>

<body>

    @RenderBody()

    @RenderSection("Scripts", required: false)

</body>

</html>

js,css引用顺序设定的更多相关文章

  1. JS的引用顺序真的灰常重要

    JS的引用一定要记得顺序,不然常常会被小小的问题卡住很久.

  2. js的引用顺序

    注意:Bootstrap中的JS插件依赖于JQuery,因此JQuery要在Bootstrap之前引用!!! 把JS文件引用放入body的最下面,是为了使js在网页全部加载完后才起作用,比如你的js里 ...

  3. .Net MVC4笔记之js css引用与压缩

    1.引用时,可以用即可以直接使用“~”来表示根目录. 引入js 引入js 引入css <link href="~/Content/uploadify/uploadify.css&quo ...

  4. ASP.Net MVC(4) 之js css引用与压缩

    资源引用 可以用即可以直接使用“~”来表示根目录. 引入js <script src="~/Areas/OrderManage/JS/Form.js"></scr ...

  5. 网站项目所有js css无法引用问题解决方案

    网站页面中的所有js css引用失效,路径确保正确,但是浏览器就是报找不到引用.仔细查找发现问题所在: 报错信息很详细了,就是.NET Framework 版本不同导致.同时也提供了两个解决方案:将. ...

  6. springMVC下jsp引用外部js,css等静态资源的解决方法

    直入主题. 1. web.xml对springMVC配置如下: <servlet> <description>Spring MVC配置</description> ...

  7. webpack下css/js/html引用图片的正确方式

    在webpack的处理下,为了使引用的图片被打包编译(以把src的图片文件编译到dist中或者对src的文件进行base64编码),应使用如下引用方式: 1. 在html/ejs等中引用图片: 借助r ...

  8. extentreports 测试报告引用extend.js/css失败

    测试工程引用extentreports 生成的测试报告,因为报告中的js和css网络不通,所以页面乱码 解决思路: 下载需要的js.css放到测试工程的static目录下 下载extentreport ...

  9. JS引用另外JS文件的顺序问题。

    1.在a.js中可以引用b.js文件,这样就可以在网页中只引用a.js文件,从而可以使用a.js和b.js文件中的所有方法. 引用格式如下:document.write('<script typ ...

随机推荐

  1. pandas 时间序列分析（一）—— 基础

    0. 以时间作为序列的索引 >> from datetime import datetime >> dates = [datetime(2011, 1, i) for i in ...

  2. 使用Toolbar + DrawerLayout快速实现高大上菜单侧滑

    如果你有在关注一些遵循最新的Material Design设计规范的应用的话(如果没有,假设你有!),也许会发现有很多使用了看起来很舒服.很高大上的侧滑菜单动画效果,示例如下(via 参考2): 今天 ...

  3. php课程 6-24 字符串函数有哪些（复习）

    php课程 6-24 字符串函数有哪些(复习) 一.总结 一句话总结: 二.php课程 6-24 字符串函数有哪些(复习) 上次复习:--------------------------------- ...

  4. WIN32汇编语言中位图的使用

    说到位图.我们事实上非常早就接触过.从最早接触计算机,我们应该就知道有图片这个东西,然后再进一步说,图片在电脑上有好几种格式比方jpg. gif .png.pcx.bmp等等,当中bmp格式的图片文件 ...

  5. 理解Erlang/OTP - Application

    http://www.cnblogs.com/me-sa/archive/2011/12/27/erlang0025.html 1>application:start(log4erl). 我们就 ...

  6. 《iOS开发全然上手——使用iOS 7和Xcode 5开发移动与平板应用》之Objective-C新手训练营

    编写Hello World应用程序通常被觉得,是学习不论什么编程语言的第一步.在这一章,你将创建iOS版的Hello World应用程序作为起步,高速了解Xcode这个开发iOS应用程序的主要工具. ...

  7. NOIP模拟 Pyramid - 斜率优化DP

    题目大意: 给一个金字塔图(下面的宽度大于等于上面的宽度),每层的高度为1,从中选取k个互不重叠的矩形,使面积最大. 题目分析: \(f[i][j]\)表示选到第i层,选择了j个矩形的最优方案. 转移 ...

  8. HDU 1422 重温世界杯 - 贪心

    传送门 题目大意: 给一串数,又正有负,求每一个前缀都大于0的最长子串长度. 题目分析: 直接贪心:每次左端点向右推1,不断延伸右端点,更新答案. code #include<bits/stdc ...

  9. Shell脚本实现超简洁的在Linux服务器上安装nginx、resin、java、tomcat、redis等程序

    说明: 用平常的方式在Linux服务器上安装程序,需要下载安装包.进入安装包位置.给安装包文件赋予可执行权限.执行安装.设置环境变量--等等一系列复杂的操作.并且如果有关联也需要一个一个的挨着安装.耗 ...

  10. 学习OpenCV研究报告指出系列（二）源代码被编译并配有实例project

    下载并安装CMake3.0.1       要自己编译OpenCV2.4.9的源代码.首先.必须下载编译工具,使用的比較多的编译工具是CMake. 以下摘录一段关于CMake的介绍: CMake是一个 ...