jquery，js引入css文件，js引入头尾
今天在项目中，需要把20多个页面加上头和尾部，头和尾是我写的，所以小师傅把这个工作交给我了。
我开始往里面加，先引入common.css，在body开始标签下面添加<header></header>,在body结束标签的地方添加<footer></footer>，然后引入common.js文件，还有每行添加注释
例如：
<!-- header -->
<header></header>
<!-- footer -->
<footer></footer>
<!-- common.css -->
<link rel="stylesheet" href="../assets/css/common.css">
<!-- common.js -->
<script src="../assets/js/common.js"></script>
然后，改了三个文件之后，我怒了。。。。。。
既然这些要引入，以前做jsp的时候，这样引入公共文件：
<%@ include file="test.jsp"%>
而现在做php，这样写：
<?php
require ROOT_PATH.'includes/header.inc.php';
?> <?php
require ROOT_PATH.'includes/footer.inc.php'; ?>
作为一个前端，是不是可以达到同样的效果呢？果断百度，综合了一下，写成了这样：
$(function(){
/* 添加头尾标签 */
$("<header></header>").insertBefore("body div:first");
$("<footer></footer>").appendTo("body");
/* 加载头尾内容 */
$("header").load("header.html");
$("footer").load("footer.html");
/* 添加样式表common.css */
$("head").append("<link>");
css = $("head").children(":last");
css.attr({
rel: "stylesheet",
type: "text/css",
href: "../assets/css/common.css"
});
})
然后，只需这样：
<script src="../assets/js/common.js"></script>
完事。这样前端出页面时，也不必苦苦等候后台的帮助了，也不用问他们怎么加入了，一行搞定~~~