初识ThinkPHP5.1的HTML复用，抽离HTML公共header和footer

                <p>首先在 <strong>application/index/view</strong> 下新建 <strong>public/header.html</strong> 和<strong> public/footer.html </strong>和 <strong>public/base.html</strong></p>

public/header.html 公共头部
public/footer.html 公共底部
public/base.html 整合

public/header.html 公共头部

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <header><h1 style="color: red;">公共---------->头部</h1></header>
</body>
</html>

public/footer.html 公共底部

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <footer><h1 style="color: green;">公共==========>底部</h1></footer>
</body>
</html>

public/base.html 整合

{include file="public/header"}

{block name="body"}{/block}
{include file="public/footer"}

然后打开 application/index/view/index/index.html

{extend name="public/base" /}

{block name="body"}
<h1>前台首页</h1>
{/block}

最后访问 http://demo.io/index.php/index/index/index 或者直接访问 http://demo.io 出现如下界面即表示公共头部与底部复用成功

介绍一下url

域名 / 入口文件【index.php】 / 模块【application目录下的直接子目录】 / 控制器【该子目录下的Controller目录中的文件】 / 操作方法【该Controller目录中文件的 function】

简单介绍一下原理

在 index 模块下新建了一个 public 目录【这里目录里面主要存放需要被复用的html】

在 public 目录下有一个 base.html 用以整合html

该 base.html 主要有两个标签组成 {incloud file=" "} 和 {block name=" "}{/block}

  {incloud file=" "} 用以引入公共的html

{block name=" "}{/block} 标签中间放置特有页面的 html 代码

然后在视图层创建 html 页面，主要有两个标签组成 {extend file=" "} 和 {block name=" "}{/block}

  {extend file=" "} 指的是继承哪个整合 html【相当于base.html是一个默认模板，可以定义多个模板，这里可以选择模板】

  {block name=" "}{/block} 标签中间放置特有页面的 html 代码

个人博客?：点此进入（http://xueshuai.top）

PHP学习交流群?：PHP学习交流群

前端学习交流群?：前端交流群

微信公众号?：叮当Ding