2016-04-18 16 views
9

HTMLとJavaScriptコードの書式設定に関するいくつかの質問があります。一般的な答えは、jsbeautify(とGitHub page for jsbeautify.js)が良い解決策であるようです。実際にHTML/Javascriptコードを美しくするようにjsbeautifier設定を構成する方法

しかし、私は自分のコードを適切にフォーマットすることができないかもしれませんし、変更が必要ないくつかのデフォルトパラメータがあるのか​​、単に美化がするべきものを誤解しているのだろうかと思います。私が期待しているのは、それぞれのネストされたタグが適切なレベルにインデントされた新しい行にあることです。しかし、代わりに私が見るもの(そしてこれはjsbeautifierに固有のものではないようです)は、いくつかのタグが同じ行に文字列を集めることがあり、行を中断する指示が無視されることがあります。

例1:

私はストレートthis questionからこの例を取りました。

<div id="hlogo"> 
    <a href="/">Stack Overflow</a>ABC</div> 

私はjsbeautifer.orgと上記のコードを入力すると、それは何もしない「を美しくJavaScriptやHTML」をクリックして行く !出力は次のようになります:

<div id="hlogo"> 
    <a href="/">Stack Overflow</a>ABC 
</div> 

ここに別の例があります。私は「80文字近くの折り返し線」を選択しました。

<!--Meta 6,1--><span><div>Just some sample text here which is fairly long, maybe about 100 characters or so, I'm not really counting.<input id="sdlkjhfkjhjkjhfjdfjkshdfkjshk"/><script type="text/javascript">; 
</script></div></span> 

この出力は次のとおりです。ラッピングが行われていないことに注意してください。

<!--Meta 6,1--><span><div>Just some sample text here which is fairly long, maybe about 100 characters or so, I'm not really counting.<input id="sdlkjhfkjhjkjhfjdfjkshdfkjshk"/><script type="text/javascript">; 
< 
/script></div > < /span> 

なぜ、<span>ない<div>、好ましくは<input>別々の行に?そしてなぜ開口部は別の行に&lt;ですか?

<!--Meta 6,1--> 
<span> 
    <div> 
     Just some sample text here which is fairly long, maybe about 100 
     characters or so, I'm not really counting. 
     <input id="sdlkjhfkjhjkjhfjdfjkshdfkjshk"/> 
     <script type="text/javascript">; 
     </script> 
    </div > 
</span> 

これを行うにはいくつかのパラメータが必要ですか?私はこれについてのドキュメントを見てきましたが、空になっています。

+1

「」が間違っています。 ''タグは空で、終了タグを持つことはできません。 – Pointy

+0

@Pointyありがとう、修正済み。 – Michael

+0

@Pointy興味深いことに、実際にはjavascriptのinput要素に子タグを追加することができます。その結果、innerHTMLは次のようなものを返します: '' – Michael

答えて

0

前方には正規表現としてそれを読むために美化引き起こしているABCの周りにスラッシュので、あなたが

<div id="hlogo"> <a href="/">Stack Overflow</a>ABC</div>

をリストされた最初の例では、正常に動作していません。

ラッピングの例では、私の言葉にアポストロフィがあるので問題があると思います。私はそれを取り出し、その後美しいものを少し動かした。 repl.itを試みたことがありますか?それは自由で、よりきれいなボタンがあり、私はそれが本当にうまく動作することが分かった。

関連する問題