4

私はphp拡張tidy-htmlを使用してphp出力をクリーンアップしています。tidyは無効なタグを削除し、HTML5 doctypeを処理することさえできないことを知っていますが、<menu>以前はHTML仕様にあったタグを使用しています。ただし、<ul>とにかく変更されます。

奇妙なことに、以前はそうしていませんでした。きちんとした設定を変更しましたが、壊れています。タグをいじるすべてのオプションをオフにしましたが、役に立ちませんでした。

私のスクリプトは非常に冗長です:

$tidy_config = array(
    'char-encoding' => 'utf8',
    'output-encoding' => 'utf8',
    'output-html' => true,
    'numeric-entities' => false,
    'ascii-chars' => false,
    'doctype' => 'loose',
    'clean' => false,
    'bare' => false,
    'fix-uri' => true,
    'indent' => true,
    'indent-spaces' => 2,
    'tab-size' => 2,
    'wrap-attributes' => true,
    'wrap' => 0,
    'indent-attributes' => true,
    'join-classes' => false,
    'join-styles' => false,
    'fix-bad-comments' => true,
    'fix-backslash' => true,
    'replace-color' => false,
    'wrap-asp' => false,
    'wrap-jste' => false,
    'wrap-php' => false,
    'wrap-sections' => false,
    'drop-proprietary-attributes' => false,
    'hide-comments' => false,
    'hide-endtags' => false,
    'drop-empty-paras' => true,
    'quote-ampersand' => true,
    'quote-marks' => true,
    'quote-nbsp' => true,
    'vertical-space' => true,
    'wrap-script-literals' => false,
    'tidy-mark' => true,
    'merge-divs' => false,
    'repeated-attributes' => 'keep-last',
    'break-before-br' => false
);

$tidy_config2 = array(
    'tidy-mark' => false,
    'vertical-space' => false,
    'hide-comments' => true,
    'indent-spaces' => 0,
    'tab-size' => 1,
    'wrap-attributes' => false,
    'numeric-entities' => true,
    'ascii-chars' => true,
    'hide-endtags' => true,
    'indent' => false
);
$tidy_config = array_merge($tidy_config, $tidy_config2);

$dtm = preg_match(self::doctypeMatch, $output, $dt);
$output = tidy_repair_string($output, $tidy_config, 'utf8');

// tidy screws up doctype --fixed
if($dtm)
    $output = preg_replace(self::doctypeMatch, $dt[0], $output);

$output = preg_replace('!>[\n\r]+<!', '><', $output);

unset($tidy_config);

return $output;

これよりも複雑であることに注意してください(したがって、2つの配列)。不要なコードを切り取ったところです。

4

2 に答える 2

8

免責事項:

私の答えはあまり...きちんとしているとは思いません。これは、HTML5でHTMLTidyを使用するためのより厄介な方法です(現在はサポートされていません)。それを達成するために、私は正規表現を使用してHTMLを解析します。これは、ほとんどの場合、すべての悪またはクトゥルフの方法の根源です。誰かがより良い方法を知っているなら、私たちに教えてください。私は正規表現を使ってhtmlを解析するのにあまり安全ではないと感じています。私は多くの例でそれをテストしましたが、それが防弾ではないと確信しています。

イントロ

メニュータグはHTML4およびXHTML1で非推奨になり、ul(順序付けられていないリスト)に置き換えられました。ただし、HTML5で再定義されたため、HTML5仕様に従って有効なタグです。HTMLTidyはHTML5をサポートせず、XHTMLまたはHTML仕様を使用するため、OPが指摘したように、特に指定しない場合でも、非推奨のタグメニューをulに置き換えます(またはulタグを追加します)。

私のおすすめ

この関数は、メニュータグを整頓して解析する前に、メニュータグをカスタムタグに置き換えます。次に、カスタムタグをメニューに再度置き換えます。

function tidyHTML5($buffer)
{
    $buffer = str_replace('<menu', '<mytag', $buffer);
    $buffer = str_replace('menu>', 'mytag>', $buffer);
    $tidy = new tidy();
    $options = array(
            'hide-comments'         => true,
            'tidy-mark'             => false,
            'indent'                => true,
            'indent-spaces'         => 4,
            'new-blocklevel-tags'   => 'menu,mytag,article,header,footer,section,nav',
            'new-inline-tags'       => 'video,audio,canvas,ruby,rt,rp',
            'doctype'               => '<!DOCTYPE HTML>',
            //'sort-attributes'     => 'alpha',
            'vertical-space'        => false,
            'output-xhtml'          => true,
            'wrap'                  => 180,
            'wrap-attributes'       => false,
            'break-before-br'       => false,
            'char-encoding'         => 'utf8',
            'input-encoding'        => 'utf8',
            'output-encoding'       => 'utf8'
    );

    $tidy->parseString($buffer, $options, 'utf8');
    $tidy->cleanRepair();

    $html = '<!DOCTYPE HTML>' . PHP_EOL . $tidy->html();
    $html = str_replace('<html lang="en" xmlns="http://www.w3.org/1999/xhtml">', '<html>', $html);
    $html = str_replace('<html xmlns="http://www.w3.org/1999/xhtml">', '<html>', $html);

    //Hackish stuff starts here
    //We use regex to parse html, which is usually a bad idea
    //But currently there is no alternative to it, since tidy is not MENU TAG friendly
    preg_match_all('/\<mytag(?:[^\>]*)\>\s*\<ul>/', $html, $matches);
    foreach($matches as $m) {
        $mo = $m;
        $m = str_replace('mytag', 'menu', $m);
        $m = str_replace('<ul>', '', $m);
        $html = str_replace($mo, $m, $html);
    }
    $html = str_replace('<mytag', '<menu', $html);
    $html = str_replace('</ul></mytag>', '</menu>', $html);
    $html = str_replace('mytag>', 'menu>', $html);
    return $html;
}

テスト:

header("Content-type: text/plain");
echo tidyHTML5('<menu><li>Lorem ipsum</li></menu><div></div><menu   ><a href="#">lala</a><form id="jj"><button>btn</button></form></menu><menu style="color: white" id="nhecos"><li>blabla</li><li>sdfsdfsdf</li></menu>');

出力:

<!DOCTYPE HTML>
<html>
    <head>
        <title></title>
    </head>
    <body>
        <menu>

            <li>Lorem ipsum
            </li>
        </menu><menu style="color: white" id="nhecos">

            <li>blabla
            </li>
            <li>sdfsdfsdf
            </li>
        </menu>
    </body>
</html>
于 2012-07-31T18:36:40.747 に答える
8

W3C tidy-html5フォークによると、新しいタグの正しい構成は次のようになります。

'new-blocklevel-tags' => 'article aside audio bdi canvas details dialog figcaption figure footer header hgroup main menu menuitem nav section source summary template track video',
'new-empty-tags' => 'command embed keygen source track wbr',
'new-inline-tags' => 'audio command datalist embed keygen mark menuitem meter output progress source time video wbr',

@tivieが彼の回答で述べたように、これは古い廃止されたタグの代わりになるはずのnew-blocklevel-tags奇妙なタグが定義されていることに気付くでしょう。temp menu

また、タグaudiovideoはとの両方に表示されnew-blocklevel-tagsますnew-inline-tags。これにより、tidyがHTMLを出力する方法が次のように変更されます。

<video src="movie.webm">
<track kind="subtitles" label="English" src="subtitles.vtt" srclang="en"></video>

あなたがからドロップvideoした場合new-inline-tags

<video src="movie.webm">
  <track kind="subtitles" label="English" src="subtitles.vtt" srclang="en">
</video>

利回りvideoからのnew-blocklevel-tags低下:

<video src="movie.webm">
<track kind="subtitles" label="English" src="subtitles.vtt" srclang="en"></video>

個人的には、ブロックレベルのタグのように動作することを好みますが、それはあなた次第ですaudiovideo

さらに、は、beingおよびとしてtags.cも定義されます。残念ながら、これらが何を表しているのかわかりません。また、これらをエミュレートすることはできないと思います。commandCM_HEADembedCM_IMG

もう1つ、定義しないnew-empty-tagsと、奇妙な出力が得られます。

<video src="movie.webm">
  <track kind="subtitles" label="English" src="subtitles.vtt" srclang="en">
  </track>
</video>

補遺

WHATWGの推奨事項もサポートする場合は、次のタグを追加する必要があります。


これが私の完全なアプローチです:

function Tidy5($string, $options = null, $encoding = 'utf8')
{
   if (extension_loaded('tidy') === true)
   {
      $default = array
      (
         'anchor-as-name' => false,
         'break-before-br' => true,
         'char-encoding' => $encoding,
         'decorate-inferred-ul' => false,
         'doctype' => 'omit',
         'drop-empty-paras' => false,
         'drop-font-tags' => true,
         'drop-proprietary-attributes' => false,
         'force-output' => false,
         'hide-comments' => false,
         'indent' => true,
         'indent-attributes' => false,
         'indent-spaces' => 2,
         'input-encoding' => $encoding,
         'join-styles' => false,
         'logical-emphasis' => false,
         'merge-divs' => false,
         'merge-spans' => false,
         'new-blocklevel-tags' => 'article aside audio bdi canvas details dialog figcaption figure footer header hgroup main menu menuitem nav section source summary template track video',
         'new-empty-tags' => 'command embed keygen source track wbr',
         'new-inline-tags' => 'audio command datalist embed keygen mark menuitem meter output progress source time video wbr',
         'newline' => 0,
         'numeric-entities' => false,
         'output-bom' => false,
         'output-encoding' => $encoding,
         'output-html' => true,
         'preserve-entities' => true,
         'quiet' => true,
         'quote-ampersand' => true,
         'quote-marks' => false,
         'repeated-attributes' => 1,
         'show-body-only' => true,
         'show-warnings' => false,
         'sort-attributes' => 1,
         'tab-size' => 4,
         'tidy-mark' => false,
         'vertical-space' => true,
         'wrap' => 0,
      );

      $doctype = $menu = null;

      if ((strncasecmp($string, '<!DOCTYPE', 9) === 0) || (strncasecmp($string, '<html', 5) === 0))
      {
         $doctype = '<!DOCTYPE html>'; $options['show-body-only'] = false;
      }

      $options = (is_array($options) === true) ? array_merge($default, $options) : $default;

      if (strpos($string, '<menu') !== false)
      {
         $menu = array
         (
            '<menu' => '<menutidy',
            '</menu' => '</menutidy',
         );
      }

      if (isset($menu) === true)
      {
         $string = str_replace(array_keys($menu), $menu, $string);
      }

      $string = tidy_repair_string($string, $options, $encoding);

      if (empty($string) !== true)
      {
         if (isset($menu) === true)
         {
            $string = str_replace($menu, array_keys($menu), $string);
         }

         if (isset($doctype) === true)
         {
            $string = $doctype . "\n" . $string;
         }

         return $string;
      }
   }

   return false;
}
于 2013-05-16T15:47:12.663 に答える