<script>
        $(document).ready(function(){
            //页面加载的时候,内容框默认显示 a.html
            $('#con').load('./a.html');
            //单击 a 链接,加载 a.html
            $("#a1").click(function(){
                $('#con').load('./a.html');
            });
            //单击 b 链接,加载 b.html
            $("#a2").click(function(){
                $('#con').load('./b.html');
            });
        })
    </script>

</head>

<body>

<ul id="nav">

<li><a href="#" id="a1">show a</a></li>

<li><a href="#" id="a2">show b</a></li>

</ul>

<div id="con"></div>

</body>

</html>
可以采用
当页面加载时,自动加载我们需要引入的html

转载于:https://www.cnblogs.com/goodboy321/p/9909989.html

静态页面如何引入head.html和foot.html相关推荐

  1. 静态页面如何实现 include 引入公用代码

    一直以来,我司的前端都是用 php 的 include 函数来实现引入 header .footer 这些公用代码的,就像下面这样: <!-- index.php --> <!DOC ...

  2. [html] 开发静态页面时,不依赖node相关的工具,如何提取出公共部分并引入?

    [html] 开发静态页面时,不依赖node相关的工具,如何提取出公共部分并引入? 比如我现在有一个index.html,如果要在其中html中引入html的话,我们假设该组件为modal.html, ...

  3. 静态页面引入看板娘live2d

    静态页面引入看板娘live2d 第一步:页面上放一个canvas <canvas id="live2d" width="280" height=" ...

  4. html静态页面引入公用组件, 开启SSI配置使shtml支持include公用的页头页脚

    转自 : http://www.phpvar.com/archives/3278.html 这是文章是为了实现前端人员编写编写项目众多静态文件时,能像php等开发语言一样使用include将页面公有的 ...

  5. jsp页面内引入静态html,JSP技术实现动态页面到静态页面的方法

    本文是介绍了jsp技术实现动态页面到静态页面的方法,分享给大家,具体如下: 对于JSP技术实现动态页面到静态页面的方案,我们从三个步骤来说明: JSP技术实现动态页面到静态页面的方案第一: 为了能深入 ...

  6. php生成静态页面并预览

    一.前言 最近要找房子搬家,作为一名青漂,每年换房子都要成为习惯了,不过还好,偌大的城市还能容得下身体和灵魂. 这篇文章主要是记录一下php生成静态页面的大致步骤,关于页面静态化,大家想必都听说过,但 ...

  7. PHP代码为什么不能直接保存HTML文件——PHP生成静态页面教程

    1.服务器会根据文件的后缀名去进行解析,如果是HTML文件则服务器不会进行语法解析,而是直接输出到浏览器. 2.如果一个页面中全部都是HTML代码而没有需要解析的PHP语法,则没有必要保存为PHP文件 ...

  8. stylus 在静态页面上的使用经验

    前段时间做vue项目,用到了css的提升开发效率的工具stylus,感觉很好用.现在又开始写静态页面了,于是将强大的stylus拿过来继续用.于是就写了这篇使用经验,算是自己总结一下. stylus的 ...

  9. css京东购物车静态页面实现

    css京东购物车静态页面实现 <!DOCTYPE html> <html><head><meta charset="utf-8">& ...

最新文章

  1. IDEA中MAVEN项目打JAR包的简单方法
  2. pip安装ipython_Python -- 关于pip安装Ipython
  3. C# WPF MVVM开发框架Caliburn.Micro IResult和协同程序⑥
  4. 创新, FMA SMA 世界第一台VCD机的故事
  5. 利用数据缓存加速文件备份
  6. SmtpClient 类
  7. HTML5 电子罗盘开发
  8. 江湖小白之一起学Python (三)双色球历史数据抓取
  9. 618的优惠券去哪了?
  10. mac mysql 移动硬盘_mac挂载移动硬盘可以读写的方法
  11. DataGridView使用技巧十二:DataGridView Error图标表示的设定
  12. AR VR MR三者的区别
  13. PHP+Wampserver(其中的MariaDB数据库)制作留言板
  14. python学习笔记 BeautifulSoup趴数据
  15. 【SpringBoot】实现短信验证码登录(榛子云的SDK)
  16. “二向箔”其实并不存在丨《三体》里的数学问题
  17. pycharm安装第三方库:Try to run this command from the system terminal. Make sure that you use the问题,亲测已解决
  18. 1对多 只取一条 mysql_MySQL 多表关联一对多查询实现取最新一条数据的方法示例...
  19. Unity学习 — VideoPlayer控制视频播放、暂停、上下选择播放!
  20. Android开发:打包APK

热门文章

  1. x58和x79服务器性能,Intel X58接班人:X79官方规格全曝光
  2. 淘宝店小蜜配置手册——店小蜜的配置框架
  3. anaconda安装软件包
  4. 01- 初识MySQL
  5. 机器自动翻译古文拼音 - 十大宋词 - 如梦令·昨夜雨疏风骤 李清照
  6. SQL——数据库使用规范(入门规范)
  7. ubuntu16.04安装GTX-960M nvidia-384驱动
  8. 认识电脑的各大组件 【主板、CPU、内存条、硬盘、显卡、显示器】
  9. Java Web项目性能测试 - JMeter测试网站吞吐量、反应时间百分比、流量
  10. ArcGIS教程:地理处理服务示例(裁剪与发送)(一)