爲什麼使用Smarty呈現時，我的HTML格式很差？

查看源代碼時，爲什麼我的HTML格式太差？爲什麼使用Smarty呈現時，我的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>

當我觀看通過鍍鉻源代碼：

<!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>

來源

2015-05-05 devstack

除了調試，美化格式化HTML的實用目的是什麼？即使對於調試，你也不需要它。 – axiac

同意@axiac，讓HTML變得毫無意義。瀏覽器必須閱讀它，而不是你。 – halfer

這是回答「爲什麼」問題的一部分。關於未說出的「如何解決」的部分，你最好試着找出如何生成更小的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結束標記?>之後，它也會刪除一個新的行字符。

該塊的結束標記將包含緊接着的尾隨換行符（如果存在的話）。

（來源：http://php.net/manual/en/language.basic-syntax.instruction-separation.php）

然而，用於Smarty的標籤的縮進的空間不既不Smarty也不由PHP移除（因爲它們不是內部標籤）。他們將它製作成最終的HTML，並且由於刪除了換行符，它們會破壞格式。

來源

2015-05-06 17:35:41 axiac

我沒有想過換行符會意外消失，在問題的例子中看不到任何明顯的影響，但這是對所涉及步驟的一個很好的解釋。 – IMSoP

的解決方案，我發現至今。

=>〜1.1 Dindent

=>〜0.11 tidy，

使在php.ini延長= php_tidy.dll

的index.php：〜1.1用此：

<?php 

// load required files 
require 'class/Slim/Slim.php'; 
require 'class/RedBean/rb.php'; 
require 'class/Dindent/Indenter.php';      //<= added 

// 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)); 
    $indenter = new \Gajus\Dindent\Indenter();    // <= start added 
    ob_start();           // 
    echo $app->render('home.tpl',array('books'=>$books)); // 
    $content = ob_get_contents();       // 
    ob_end_clean();          // 
    echo $indenter->indent($content);      // <= end added 


}); 


$app->run();

〜0.11使用這個：

ob_start(); 
    $app->render('home.tpl',array('books'=>$books)); 
    $buffer = ob_get_clean(); 
    $tidy = new tidy(); 
    $clean = $tidy->repairString($buffer, 
     array(
      'indent' => true 
      ,'indent-attributes' => true 
    )); 
    echo $clean;

輸出預期：

<!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>

來源

2015-05-06 08:26:53 devstack

注意，執行時間從〜0.09增加到〜1.1 有沒有人有更好的解決方案 – devstack

是的，學會手動縮進。允許回車和製表符實際存在於html中，而不是在你的php/template引擎中。 – Sharky

由於作爲問的問題是「爲什麼是代碼不漂亮？」不是「我如何使它變得漂亮？」，我會給出簡單的答案：

Smarty（和PHP）正在通過你已經放入模板的空格;它不知道你正在創建的HTML結構。唯一會被剝離的是Smarty標籤本身。

因此，舉例來說，如果你這樣寫：

[ 
    {if $foo} 
     foo 
    {else} 
     bar 
    {/if} 
    ]

所有這些空間將成爲輸出的一部分，這將是兩種：

[ 

     foo 

    ]

或：

[ 

     bar 

    ]

因此，如果您不希望輸出中出現空格，請不要將其包含在輸入中。

一個竅門是把它註釋掉：

[{* 
    *}{if $foo}{* 
     *}foo{* 
    *}{else}{* 
     *}bar{* 
    *}{/if}{* 
    *}]

，這將導致：

[foo]

或：

[bar]

來源

2015-05-06 16:56:06 IMSoP

爲什麼使用Smarty呈現時，我的HTML格式很差？

回答

相關問題