模板引擎（smarty）知识点总结

时间 2019-11-30

标签模板引擎 smarty 知识总结繁體版

原文原文链接

   首先咱们必须知道使用smarty的流程
   一、引入
   二、实例化
   三、配置模板目录编译目录 3.0版本支持不存在的目录则新建
   四、赋值
   五、编译显示某个模板文件（暗示须要哪一个文件）javascript

案例1：php

 1 include('./lib/Smarty.class.php');$smarty = new Smarty();
 2 
 3 　　　　$smart->template_dir = './tmp';//设置模板文件目录
 4 
 5 　　　　$smarty->compile_dir = './comp';//设置编译文件目录
 6 
 7 　　　　$content = 'smarty学习的第一个小案例';
 8 
 9 　　　　$smarty->assign('content',$content);////通常而言，assign参数一与参数二对应  参数一的名就是参数二$参数一的名  固然不这样也行 参数二也能够不用变量  参数一与模板的变量对应[这就是你们常
说的模板渲染值，供html等使用]
10 
11            $smarty->display('./tmp/tmp01.html');

html代码:css

 1 <!doctype html>
 2 <html>
 3    <head>
 4       <meta charset="utf-8"/>
 5       <title>案例1</title>
 6    </head>
 7     <body>
 8         <pre>{$content}</pre>
 9      </body>
10 </html>

该案列很好说明smarty的使用的流程，初学smarty的同窗能够借鉴下。html

java

一、关联数组：引用方式：$数组名.key
二、索引数组：引用方式：$数组名.key 或者 $数组名[index]数组

案列2:学习

 1 <?php
 2   require_once './lib/Smarty.class.php';
 3   $smt = new Smarty();
 4   $smt->template_dir = './tmp';
 5   $smt->compile_dir = './comp';
 6   $arr1 = array('周一','周二','周三');
 7   $arr2 = array('id'=>1,'name'=>'告白气球','author'=>'周杰伦');
 8   $smt->assign('arr1',$arr1);
 9   $smt->assign('arr2',$arr2);
10   $smt->display('./tmp/tmp02.html');

html代码ui

     <table  border='1' cellspacing='0' cellpadding='0' style='text-align:center'>
        <tbody>
            <tr>
                <td valign='top' >星期一</td>
                <td valign='top' style='color:#f69'>{$arr1[0]}</td>
            </tr>
            <tr>
                <td valign='top'>星期二</td>
                <td valign='top'style='color:#f69'>{$arr1[1]}</td>
            </tr>
            <tr>
                <td valign='top'>星期三</td>
                <td valign='top'>{$arr1[2]}</td>
            </tr>
        </tbody>
    </table>
    <hr/>
     <table  border='1' cellspacing='0' cellpadding='0' style='text-align:center'>
        <tbody>
            <tr>
                <td valign='top' >ID</td>
                <td valign='top' style='color:#f69'>{$arr2.id}</td>
            </tr>
            <tr>
                <td valign='top'>歌名</td>
                <td valign='top'style='color:#f69'>{$arr2.name}</td>
            </tr>
            <tr>
                <td valign='top'>做者</td>
                <td valign='top'>{$arr2.author}</td>
            </tr>
        </tbody>
    </table>
    <hr/>
     <table  border='1' cellspacing='0' cellpadding='0' style='text-align:center'>
        <tbody>
            <tr>
                <td valign='top' >周一</td>
                <td valign='top' style='color:#f69'>{$arr1.0}</td>
            </tr>
            <tr>
                <td valign='top'>周二</td>
                <td valign='top'style='color:#f69'>{$arr1.1}</td>
            </tr>
            <tr>
                <td valign='top'>周三</td>
                <td valign='top'>{$arr1.2}</td>
            </tr>
        </tbody>
    </table>

案列2很好的说明数组的使用，那么当咱们了解到了smarty的循环的时候就能够将数组元素调用的知识结合起来了this

spa

一、修改标记 $smarty->delimiter 而后在模板文件里使用新的定界符
二、在模板文件里使用 {literal}{/literal}标记非替换的

先说说冲突的所在：smarty默认的定界符是'{','}' html中 css样式的写法是:*{font-size:1rem;} 经过观察不难发现css与smarty的定界符冲突了，这样会致使css样式也被编译解析了，所以就必须解决这个问题

案例3

  require_once('./libs/Smarty.class.php');
  $smarty = new Smarty();
  $smarty->template_dir = './tmp';
  $smarty->compile_dir = './comp';
  $like1 = array('name'=>'冯**','jd'=>'初一到初二','element'=>'先后同桌，默默暗恋她,感受很奇妙，那个时候很开心');
  $like3 = array('李**','高一','文科班的同窗，先后同桌过，类型很嗨，很好玩，也是暗恋她，还在情*节送她礼物，被她以要是有我朋友的身高就在一块儿的理由拒绝了');
 // 修改定界符 $smarty->delimiter
  $smarty->left_delimiter = '{<';
  $smarty->right_delimiter = '>}';
  $smarty->assign('name',$like1['name']);
  $smarty->assign('jd',$like1['jd']);
  $smarty->assign('element',$like1['element']);
  $smarty->assign('like3',$like3);
  $smarty->display('./temp/tmp03.html');

html代码

<!DOCTYPE HTML>
<html>
 <head>
  <title> 案例3 </title>
  <meta charset="utf-8"/>
  <script type='text/javascript'>
    window.onload=function(){
        var tables = document.getElementsByTagName('table');
            for(var i=0;i<tables.length;i++){
               tables[i].onmouseover=function(){
                //alert(this.border);
                this.style.backgroundColor = 'yellow';
               }
            }
        }
  </script>
  <style>
   /*
    这样带分隔符的样式写法   3.0会自动处理掉
    可是不换行的  系统处理不了
    table{
        background-color:#666;
   }
   */
 table{background-color:#666;}
  </style>
 </head>

 <body>
     <table  border='1' cellspacing='0' cellpadding='0' style='text-align:center'>
        <tbody>
            <tr>
                <td valign='top' >名字</td>
                <td valign='top' style='color:#f69'>{<$name>}</td>
            </tr>
            <tr>
                <td valign='top'>阶段</td>
                <td valign='top'style='color:#f69'>{<$jd>}</td>
            </tr>
            <tr>
                <td valign='top'>发生的事</td>
                <td valign='top'><textarea rows='4' cols='10' readonly='readonly'>{<$element>}</textarea></td>
            </tr>
        </tbody>
    </table>
    <hr/>
     <table  border='1' cellspacing='0' cellpadding='0' style='text-align:center'>
        <tbody>
            <tr>
                <td valign='top' >名字</td>
                <td valign='top' style='color:#f69'>{<$like3[0]>}</td>
            </tr>
            <tr>
                <td valign='top'>阶段</td>
                <td valign='top'style='color:#f69'>{<$like3[1]>}</td>
            </tr>
            <tr>
                <td valign='top'>发生的事</td>
                <td valign='top'><textarea rows='4' cols='10' readonly='readonly'>{<$like3[2]>}</textarea></td>
            </tr>
        </tbody>
    </table>
 </body>
</html>

<!-------------------------------------------------------------------->
{literal){/literal}
在css样式里加入table{literal}{background-color:#666;}{/literal}<!-----------------------------今天的内容就到这里了，后续会继续补充，尽请期待！