前端怎么在每个页面引用共同的头部后底部

要想实现这种有几种可以供大家参考:

 1:使用ssi技术页面生成shtml文件,只用在头部文件位置加入,然后修改的时候只要修改header.htm文件就可以了。使用shtml的好处是对搜索引擎比较友好,需要处理的文件在服务器端完成的,不会加重访问者的浏览器负担。

 2:使用js , 建立一个head.js的文件, 找一个html转js的网站 然把你头部的html代码转化成js代码,并放在head.js文件里面。 然后在需要调用head文件代码的地方添加 这个地方src="js/head.js"的路径是你head.js文件的路径。 这个样子就可以了~ 这种方式的优点是方便,便于修改。缺点是由于搜索引擎读不懂javascript文件,头部文件和尾部文件搜索引擎无法收录,而且js文件过大会加重访问者的浏览器负担,影响访问速度。

3:使用iframe 以前人们常常使用静态frame框架来做首尾(一般不是iframe)。现在越来越少见了。主要因为设计网页相对比较困难,而且还增加了连接数,而且也不利于搜索引擎的对头尾的收录。这种最容易出现bug,曾经本人用这个就出现了bug,下面这张这个导航是iframe 引入的 ,但是下拉菜单会会把导航给撑大 ,导致下面的文字不能紧挨着上面。

4:使用php ,这个是我最喜欢的方法,做法很简单,只需把后缀为html的文件改成php就行,然后在每个页面对应的位置上使用include_once(" ")就行。


最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容