web-dev-qa-db-ja.com

HTML Tidyを使用してHTMLコードをインデントするだけですか？

HTML Tidyを使用してHTMLコードをインデントすることは可能ですか？

サンプルコード

<form action="?" method="get" accept-charset="utf-8">

<ul>
<li>
<label class="screenReader" for="q">Keywords</label><input type="text" name="q" value="" id="q" />
</li>
<li><input class="submit" type="submit" value="Search" /></li>
</ul>


</form>

必要な結果

<form action="?" method="get" accept-charset="utf-8">
    <ul>
        <li>
        <label class="screenReader" for="q">Keywords</label><input type="text" name="q" value="" id="q"/>
        </li>
        <li><input class="submit" type="submit" value="Search"/></li>
    </ul>
</form>

標準のコマンドで実行すると、tidy -f errs.txt -m index.htmlそれから私はこれを手に入れます

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
<meta name="generator" content=
"HTML Tidy for Mac OS X (vers 31 October 2006 - Apple Inc. build 15.3.6), see www.w3.org">
<title></title>
</head>
<body>
<form action="?" method="get" accept-charset="utf-8">
<ul>
<li><label class="screenReader" for=
"q">Keywords</label><input type="text" name="q" value="" id=
"q"></li>
<li><input class="submit" type="submit" value="Search"></li>
</ul>
</form>
</body>
</html>

どうすれば余分なものをすべて省略して、実際にコードをインデントできますか？

それがサポートするはずの機能ではない場合、許してください。どのライブラリ/ツールを探していますか？

htmlhtmltidy
32
cwd

indent、tidy-mark、およびquietオプションのみを含む構成ファイルを使用します。

indent: auto
indent-spaces: 2
quiet: yes
tidy-mark: no

tidy_config.txtという名前を付け、.htmlファイルと同じディレクトリに保存します。次のように実行します。

tidy -config tidy_config.txt index.html

さらにカスタマイズするには、 tidy manページ を使用して、markup: noやforce-output: yesなどの他の関連オプションを見つけます。

21
Paul Sweatte

「再インデントのみ-変更なし」の可能性は見つかりませんでした。次の設定ファイルは可能な限り低く "修復"し、（ほとんどの場合）htmlを再インデントするだけです。 Tidyは、重複した（繰り返された）属性などのいくつかのエラーのある状態をまだ修正しています。

#based on http://tidy.sourceforge.net/docs/quickref.html
#HTML, XHTML, XML Options Reference
anchor-as-name: no  #?
doctype: omit
drop-empty-paras: no
fix-backslash: no
fix-bad-comments: no
fix-uri:no
hide-endtags: yes   #?
#input-xml: yes     #?
join-styles: no
literal-attributes: yes
lower-literals: no
merge-divs: no
merge-spans: no
output-html: yes
preserve-entities: yes
quote-ampersand: no
quote-nbsp: no
show-body-only: auto

#Diagnostics Options Reference
show-errors: 0
show-warnings: 0

#Pretty Print Options Reference
break-before-br: yes
indent: yes
indent-attributes: no   #default
indent-spaces: 4
tab-size: 4
wrap: 132
wrap-asp: no
wrap-jste: no
wrap-php: no
wrap-sections: no

#Character Encoding Options Reference
char-encoding: utf8

#Miscellaneous Options Reference
force-output: yes
quiet: yes
tidy-mark: no

たとえば、次のhtml-fragment

<div>
<div>
<p>
not closed para
<h1>
h1 head
</h1>
<ul>
<li>not closed li
<li>closed li</li>
</ul>
some text
</div>
</div>

に変わります

<div>
    <div>
        <p>
            not closed para
        <h1>
            h1 head
        </h1>
        <ul>
            <li>not closed li
            <li>closed li
            </ul>some text
    </div>
</div>

お気づきのように、hide-endtags: yesは入力の2番目の箇条書きから終了</li>を隠します。 hide-endtags: noの設定-次を取得します：

<div>
    <div>
        <p>
            not closed para
        </p>
        <h1>
            h1 head
        </h1>
        <ul>
            <li>not closed li
            </li>
            <li>closed li
            </li>
        </ul>some text
    </div>
</div>

したがって、tidyは、最初の箇条書きにクロージング</p>およびクロージング</li>を追加します。

入力のすべてを保持し、ファイルを再インデントするだけの可能性は見つかりませんでした。

19
kobame

次のオプションが必要です。

tidy --show-body-only yes -i 4 -w 80 -m file.html

http://tidy.sourceforge.net/docs/quickref.html#show-body-only

-i 4-4つのスペースをインデントします（tidyはタブを使用しません）

-w 80-80桁目で折り返す（私のシステムのデフォルト：68、非常に狭い）

-m-ファイルをインプレースで変更

（最後のオプションを省略して、最初に出力を確認することもできます）

体だけを表示すると、当然tidy-mark（ジェネレータmeta）。

別のクールなオプションは次のとおりです：--quiet yes-W3C広告やその他の不要な出力を出力しません（エラーは報告されます）

11
Tomasz Gandor

Tidyを使用してHTMLコードをインデントするだけで、投稿者の元の質問に答えるために、私が使用するものは次のとおりです。

tidy --indent auto --quiet yes --show-body-only auto --show-errors 0 --wrap 0 input.html

input.html

<form action="?" method="get" accept-charset="utf-8">

<ul>
<li>
<label class="screenReader" for="q">Keywords</label><input type="text" name="q" value="" id="q" />
</li>
<li><input class="submit" type="submit" value="Search" /></li>
</ul>


</form>

出力：

<form action="?" method="get" accept-charset="utf-8">
  <ul>
    <li><label class="screenReader" for="q">Keywords</label><input type="text" name="q" value="" id="q"></li>
    <li><input class="submit" type="submit" value="Search"></li>
  </ul>
</form>

追加のHTMLコードは追加されません。エラーは抑制されます。各オプションの機能を確認するには、 公式リファレンス を参照することをお勧めします。

3
thdoan

私はパーティーに非常に遅れています:)

しかし、整頓された設定ファイルセットでは

きちんとしたマーク：いいえ

デフォルトではyesに設定されています。

完了すると、tidyはHTMLにメタジェネレータータグを追加しません。

3
user1785636