node.js 在 Jade 中使用 HTML 是否被认为是不好的做法？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/16094423/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Is it considered bad practice to use HTML in Jade?
提问by n0pe
Jade looks like a cool templating engine and I think I'll be using it for my next project. However, some of the syntax doesn't make sense to me.
Jade 看起来像一个很酷的模板引擎，我想我会在我的下一个项目中使用它。但是，有些语法对我来说没有意义。
What do you get by doing this:
这样做你会得到什么：
ul
li
a(href="#book-a") Book A
instead of:
代替：
<ul>
<li><a href="#book-a">Book A</a></li>
</ul>
I understand you save some typing, but it seems less readable to me. I noticed on Jade's live demo that regular html passes right through the translation. So would it be considered bad practise to do something like this:
我知道你节省了一些打字的时间，但对我来说似乎不太可读。我注意到在 Jade 的现场演示中，常规 html 直接通过翻译。那么做这样的事情会不会被认为是不好的做法：
<div class="someClass">
<h3> #{book.name} </h3>
</div>
回答by laconbass
Background
背景
Actually jade/pug syntax allows plain HTML (or any other plain text) through the use of 3 syntaxes, as you can see in the reference on the project's site.
实际上，jade/pug 语法通过使用 3 种语法允许纯 HTML（或任何其他纯文本），如您在项目站点上的参考中所见。
dot syntax(also known as "Block in a Tag")
点语法（也称为“标签中的块”）
ul.
<li><a href="#book-a">Book A</a></li>
<li><a href="#book-b">Book B</a></li>
pipe syntax(also known as "Piped Text")
管道语法（也称为“管道文本”）
ul
| <li><a href="#book-a">Book A</a></li>
| <li><a href="#book-b">Book B</a></li>
tag syntax(also know as "Inline in a Tag"), "Simply place some content after the tag", can also do the trick
标签语法（也称为“ Inline in a Tag”），“只需在标签后放置一些内容”，也可以做到这一点
ul
li <a href="#book-a">Book A</a>
which will render
这将呈现
<ul><li><a href="#book-a">Book A</a></li></ul>
The Question
问题
Back to your question, your sample
回到你的问题，你的样本
<div class="someClass">
<h3> #{book.name} </h3>
</div>
could be written as simple as
可以写成这样简单
.someClass
h3= book.name
Which is a lot more readable I think, so in that case you should consider a bad practice writing raw HTML, but not always.
我认为这更具可读性，因此在这种情况下，您应该考虑编写原始 HTML 的不良做法，但并非总是如此。
IMO
海事组织
IMO, common sense is the best good practice. Maybe i would consider using a raw chunk of HTML to insert a widget on the page, i.e. a youtube video or a custom google map <iframe>.
IMO，常识是最佳实践。也许我会考虑使用原始 HTML 块在页面上插入一个小部件，即 youtube 视频或自定义谷歌地图 <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>
As said above, here doesn't makes sense to use the attribute syntax. The result is nearly the same, and is quicker leaving the raw html.
如上所述，这里使用属性语法没有意义。结果几乎相同，并且更快地离开原始 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)
回答by Nelo Mitranim
Jade now provides inline syntax for nested tags:
Jade 现在为嵌套标签提供内联语法：
a: img
turns into
变成
<a><img/></a>
Taken from the official documentation.
取自官方文档。
回答by nilakantha singh deo
you can use the following approach too to use plain html as your view engine.
您也可以使用以下方法来使用纯 html 作为您的视图引擎。
app.set('views', path.join(__dirname, '/path/to/your/folder'));
app.set("view options", {layout: false});
app.engine('html', function(path, opt, fn) {
fs.readFile(path, 'utf-8', function(error, str) {
if (error)
return str;
return fn(null, str);
});
});
});
