为什么用Smarty渲染时HTML的格式如此差？

devstack 发表于 Dev

开发者栈

为什么查看源代码时HTML的格式如此差？

使用：

index.php：

<?php

// load required files
require 'class/Slim/Slim.php';
require 'class/RedBean/rb.php';

// register slim auto-loader
\Slim\Slim::registerAutoloader();

// set up database connection
R::setup('mysql:host=localhost;dbname=slimcms','root','');
R::freeze(true);


// initialize app
$app = new \Slim\Slim(array(
    'mode' => 'development'
    ,'debug' => true
    ,'view' => new \Slim\Views\Smarty()
    ,'templates.path' => './templates'
));


$view = $app->view();

$view->parserDirectory = dirname(__FILE__) . '/class/Smarty/';
$view->parserCompileDirectory = dirname(__FILE__) . '/compiled';
$view->parserCacheDirectory = dirname(__FILE__) . '/cache';



// handle GET request for index
$app->get('/', function() use ($app){
    $books = R::findAll('book');
//print_r($books);
    $app->render('home.tpl',array('books'=>$books));

});


$app->run();

模板/home.tpl：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>Home</title>
</head>
<body>    
    <div id="content">
        {foreach name=aussen item=book from=$books}
            {foreach key=key item=value from=$book}
                {if $key == 'id' }
                    <a href="{$key}/{$value}">{$key}</a>
                {else}{$key}{/if}
            {/foreach}
            <hr />
        {/foreach}
    </div>    
</body>
</html>

当我通过chrome查看源代码时：

    <!DOCTYPE html>
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>Home</title>
</head>
<body>
    <div id="content">
                                                        <a href="id/1">id</a>
                                            rating                            price                            title                        <hr />
                                                        <a href="id/2">id</a>
                                            rating                            price                            title                        <hr />
            </div>
</body>
</html>

我本来期望：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta content="text/html; charset=utf-8" http-equiv="Content-Type">
    <title>Home</title>
</head>
<body>
    <div id="content">
        <a href="id/1">id</a> rating price title
        <hr>
        <a href="id/2">id</a> rating price title
        <hr>
    </div>
</body>
</html>

缺氧

这是对问题“为什么”部分的回答。关于不言而喻的“如何修复”部分，您最好尝试找出如何生成更小的HTML而不是更漂亮的HTML。

在编译时，Smarty替换由包围的片段{和}用PHP代码块，封闭在<?php和?>。

以下Smarty模板片段：

<div id="content">
    {foreach name=aussen item=book from=$books}
        {foreach key=key item=value from=$book}
            {if $key == 'id' }
                <a href="{$key}/{$value}">{$key}</a>
            {else}{$key}{/if}
        {/foreach}
        <hr />
    {/foreach}
</div>

变成类似：

<div id="content">
    <?php foreach ($books as $book): ?>
        <?php foreach ($book as $key => $value) : ?>
            <?php if ($key == 'id'): ?>
                <a href="<?php echo $key; ?>/<?php echo $value; ?>">{$key}</a>
            <?php else ?><?php echo $key; ?><?php endif; ?>
        <?php endforeach; ?>
        <hr />
    <?php endforeach; ?>
</div>

请注意，上面的PHP代码不是Smarty生成的。Smarty生成的代码由于其存储分配给模板的变量的方式，其处理内置函数的属性，变量修饰符及其提供的其他功能的方式而变得更加复杂。
但是出于讨论的目的，代码的这种过度简化的版本就足够了。此处重要的是，Smarty请勿在{ ... }块外更改任何内容。

Smarty不会破坏模板/ HTML代码的格式。PHP是做到这一点的人。

PHP解释代码块（用<?php和括起来?>），并将其替换为它们生成的输出（如果有）。但是，如果它在PHP结束标记之后，它还会删除一个换行符?>。