Jade はクールなテンプレート エンジンのようで、次のプロジェクトで使用すると思います。ただし、一部の構文は意味がありません。
これを行うことで何が得られますか:
ul
li
a(href="#book-a") Book A
それ以外の：
<ul>
<li><a href="#book-a">Book A</a></li>
</ul>
タイピングの手間を省いていることは理解していますが、私には読みにくいようです。Jade のライブ デモで、通常の html が翻訳をそのまま通過することに気付きました。したがって、次のようなことを行うのは悪い習慣と見なされます。
<div class="someClass">
<h3> #{book.name} </h3>
</div>
プロジェクトのサイトのリファレンスでわかるように、実際には jade/pug 構文では 3 つの構文を使用してプレーン HTML (またはその他のプレーン テキスト) を使用できます。
ドット構文(" Block in a Tag "とも呼ばれます)
ul.
<li><a href="#book-a">Book A</a></li>
<li><a href="#book-b">Book B</a></li>
パイプ構文(「 Piped Text 」とも呼ばれます)
ul
| <li><a href="#book-a">Book A</a></li>
| <li><a href="#book-b">Book B</a></li>
タグ構文(「Inline in a Tag」とも呼ばれます)、「タグの後にコンテンツを配置するだけ」でも、このトリックを行うことができます
ul
li <a href="#book-a">Book A</a>
レンダリングする
<ul><li><a href="#book-a">Book A</a></li></ul>
あなたの質問、あなたのサンプルに戻ります
<div class="someClass">
<h3> #{book.name} </h3>
</div>
次のように簡単に書くことができます
.someClass
h3= book.name
どちらがはるかに読みやすいと思うので、その場合は、生の HTML を書くという悪い習慣を検討する必要がありますが、常にそうとは限りません。
IMO、常識が最善の実践です。たぶん、HTML の生のチャンクを使用してページにウィジェット、つまり YouTube ビデオまたはカスタム Google マップ <iframe> を挿入することを検討します。
<iframe width="425" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://maps.google.es/maps/ms?msa=0&msid=217708588685721440865.0004d1d4faefdd11adf39&ie=UTF8&ll=43.167638,-7.838262&spn=1.010793,0.991384&t=m&output=embed"></iframe>
<iframe width="420" height="315" src="http://www.youtube.com/embed/_Vkm2nMM3-Q" frameborder="0" allowfullscreen></iframe>
上で述べたように、ここで属性 syntaxを使用する意味はありません。結果はほぼ同じで、未加工の html を残す方が高速です。
iframe(width="425", height="350", frameborder="0", scrolling="no", marginheight="0", marginwidth="0" src="https://maps.google.es/maps/ms?msa=0&msid=217708588685721440865.0004d1d4faefdd11adf39&ie=UTF8&ll=43.167638,-7.838262&spn=1.010793,0.991384&t=m&output=embed")
iframe(width="420", height="315", src="http://www.youtube.com/embed/_Vkm2nMM3-Q", frameborder="0", allowfullscreen)