html 如何引入一个公共的头部和底部

摘要： LINK[rel=import]其实有点相似于IFRAME，它引用的对象也是一个完整的文档，而不是文档片断，并且里面的SCRIPT也会执行，对跨域的资源访问一样有同源策略的限制javascript

html 静态页面中引用外部页面没那么方便，主要方法有：php

asp语言和PHP语言

首先制做一个头部文件head.asp，或者一个底部文件foot.asp。如主页是index.asp，调用头部代码是在index.asp文件代码的开始位置（第一个标记后面，css

标记前面）增长以下代码：html

<!–  #include file=”head.asp”    –>

若是是PHP文件，文件名改成 head.php便可java

使用框架来实现

<iframe MARGINWIDTH=0 MARGINHEIGHT=0 HSPACE=0 VSPACE=0 FRAMEBORDER=0 SCROLLING=no src=”head.htm” height=“auto” width="100%"></iframe>

之前人们经常使用静态frame框架来作首尾(通常不是iframe)。如今愈来愈少见了。主要由于设计网页相对比较困难，并且还增长了链接数,占用线程较多，速度慢，并且也不利于搜索引擎的对头尾的收录跨域

使用.js脚原本实现

创建一个head.js的文件，找一个html转js的网站，而后把你头部的html代码转化成js代码，并放在head.js文件里面。而后在须要调用head文件代码的地方添加浏览器

<script language="javascript" type="text/javascript" src="js/head.js"></script>

这个地方src="js/head.js"的路径是你head.js文件的路径框架

html转换为JS:网站

document.writeln("<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Transitional//EN\" \"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd\">");
document.writeln("<html xmlns=\"http://www.w3.org/1999/xhtml\">");
document.writeln("<head>");
document.writeln("<style>");
document.writeln("</style>");
document.writeln("<meta http-equiv=\"Content-Type\" content=\"text/html; charset=utf-8\" />");
document.writeln("<title></title>");
document.writeln(" <link href=\'head.css\'  rel=\"stylesheet\" type=\"text/css\" />");
document.writeln("</head>");
document.writeln("<body >");
document.writeln(" <div class=\'miaov_head\'>");
document.writeln("    <ul>");
document.writeln("      <li><a href=\"http://www.cnblogs.com/jtjds/\">Mac</a></li>");
document.writeln("      <li><a href=\"http://www.cnblogs.com/jtjds/\">iPhone</a></li>");
document.writeln("    </ul>");
document.writeln("</div>");
document.writeln(" ");
document.writeln("</body>");
document.writeln("</html>");
document.writeln("");

之后不管在哪一个页面，想调用该头部文件，直接插入head.js文件便可ui

这种方式的优势是方便，便于修改。缺点是因为搜索引擎读不懂javascript文件，头部文件和尾部文件搜索引擎没法收录，并且js文件过大会加剧访问者的浏览器负担，影响访问速度

Behavior的download方式

最好能有一种方法，就像asp页面包含其余页面时那样，用一小段包含语句就能够实现，不要将须要包含的内容出如今本页面内，而是分割出去到另一个本身的页面