怎么把html页面中共用的底部代码做成共享模块
问:
很多时候,我们在设计网站时会发现,站内每一个页面的header跟footer其实都是一样的,如果每个页面都写header跟footer就会显示代码冗余而且维护也不方便,
这时候最好的做法就是把相同的头部跟底部做成共享模块,每个页面直接引入该模块,既简介又方便维护
方法1:
JQuery 首先引入jquery包,然后创建两个div,用来放置header跟footer;然后利用jquery的load()事件把公用部分加载进来
方法2:
将footer写一个新的html文件。
如:
<div class="footer">
<iframe src="footer.html" frameborder="0" scrolling="no"></iframe>
</div>
方法3:
直接写一个js文件 取名footer.js 动态加载~~把footer写进js里,用document.writeln 即可解决你的问题
方法4:
如果你是用php 写的话就更简单了 直接 include引入footer页面就可以了
怎么把html页面中共用的底部代码做成共享模块的更多相关文章
- 分页技巧_改进JSP页面中的公共分页代码_实现分页时可以有自定义的过滤与排序条件
分页技巧__改进JSP页面中的公共分页代码 自定义过滤条件问题 只有一个url地址不一样写了很多行代码 public>>pageView.jspf添加 分页技巧__实现分页时可以有自定义的 ...
- 如何在PHP页面中原样输出HTML代码(是该找本php的数来看了)
如何在PHP页面中原样输出HTML代码(是该找本php的数来看了) 一.总结 一句话总结:字符串与HTML之间的相互转换主要应用htmlentities()函数来完成. 1.php中的html标签如何 ...
- 2017.11.4 JavaWeb-----基于JavaBean+JSP求任意两数代数和(改进的在JSP页面中无JSP脚本代码的)+网页计数器JavaBean的设计与使用
修改后的JSP中不含有JSP脚本代码这使得JSP程序的清晰性.简单 1.设计JavaBean 的Add.java 类 package beans; public class Add { private ...
- PHP如何在页面中原样输出HTML代码
字符串与HTML之间的相互转换主要应用htmlentities()函数来完成. header("Content-Type: text/html; charset=utf-8"); ...
- SharePoint 页面中添加.Net代码
今天整理资料,看到一个非常有意思的截图,可以在SharePoint页面库里的页面中,添加.Net代码,只需修改一下相应应用程序的web.config文件,即可: 在web.config里面的<P ...
- HTML页面中JavaScript能获取到的各种屏幕大小信息
在HTML页面中,通过JavaScript代码访问 window 对象,能够获取到很多表征屏幕大小的信息,下面列举并加以区分. window 对象中的屏幕信息 window.innerheight. ...
- HTML页面中显示HTML标签<xmp>
最近做东西遇到一个HTML页面中显示HTML标签的需求,比如要显示</span> 解决方法如下 HTML页面中显示HTML标签代码,可以使用<xmp>html标签内容</ ...
- JavaScript在页面中的引用方法
现在前端开发越来越流行,框架也越来越多,像ExtJs.JQuery.Bootstrap等.虽然入行这么多年,但是感觉自己在前端方面还是存在基础不牢的地方,特别是CSS和JS.因此最近打算重新阅读这方面 ...
- 如何在HTML不同的页面中,共用头部与尾部?
一.asp语言和PHP语言 首先制作一个头部文件head.asp,或者一个底部文件foot.asp.如主页是index.asp,调用头部代码是在index.asp文件代码的开始位置(第一个标记后面,& ...
随机推荐
- echo -e 参数
-e 若字符串中出现以下字符,则特别加以处理,而不会将它当成一般文字输出: \a 发出警告声: \b 删除前一个字符: \c 最后不加上换行符号: \f 换行但光标仍旧停留在原 ...
- aliyun添加数据盘parted方式分区格式化和lvm挂载及数据盘的扩容
一.普通磁盘分区管理方式 1.对磁盘进行分区 列出磁盘 # fdisk -l # fdisk /dev/vdb Welcome to fdisk (util-linux 2.23.2). Change ...
- centos7.2环境下安装smokeping对网络状态进行监控
centos7.2环境下安装smokeping对网络状态进行监控 安装smokeping建议用centos7,用centos6.5一直卡在smokeping那里,下载不了perl的扩展插件,可能是因为 ...
- cacti系列(一)之cacti的安装及配置监控mysql服务
简介 Cacti是通过 snmpget来获取数据,使用 RRDtool绘画图形,而且你完全可以不需要了解RRDtool复杂的参数.它提供了非常强大的数据和用户管理功能,可以指定每一个用户能查看树状结构 ...
- FreeSWITCH Git版本管理
由于测试FreeSWITCH不同版本的需要,研究了下Git的使用,通过Git来管理所有的版本,方便了测试.以下就总结下具体的使用方法: 其中:git clone ..是现在git仓库:git tag ...
- CPU密集型 VS IO密集型
CPU密集型 CPU密集型也叫计算密集型,指的是系统的硬盘.内存性能相对CPU要好很多,此时,系统运作大部分的状况是CPU Loading 100%,CPU要读/写I/O(硬盘/内存),I/O在很短的 ...
- process.cwd()与__dirname的区别
process.cwd() 是当前执行node命令时候的文件夹地址 ——工作目录,保证了文件在不同的目录下执行时,路径始终不变__dirname 是被执行的js 文件的地址 ——文件所在目录 Node ...
- Codeforces 448C Painting Fence(分治法)
题目链接:http://codeforces.com/contest/448/problem/C 题目大意:n个1* a [ i ] 的木板,把他们立起来,变成每个木板宽为1长为 a [ i ] 的栅 ...
- easyUI拖动购物车案例
<!DOCTYPE html><html><head> <meta http-equiv="Content-Type" content=& ...
- python 全栈开发,Day128(创建二维码,扫码,创建玩具的基本属性)
昨日内容回顾 1.app播放音乐 plus.audio.createPlayer(文件路径/URL) player.play() 播放音乐 player.pause() 暂停播放 player.res ...