在玉中使用HTML是不是很糟糕的做法？ [英] Is it considered bad practice to use HTML in Jade?

问题描述

翡翠看起来像一个很酷的模板引擎，我想我会用它来做下一个项目。但是，有些语法对我来说没有意义。

通过这样做你能得到什么：

  ul 
 li 
a（href =＃book-a）Book A 
  

而不是：

 < ul> 
< li>< a href =＃book-a>书A< / a>< / li> 
< / ul> 
  

我明白你保存一些打字，但对我来说似乎不太可读。我在Jade的现场演示中注意到，正常的html通过翻译。所以这样做会被认为是不好的做法：

 < div class =someClass> 
< h3> ＃{book.name}< / h3> 
< / div> 
  

解决方案

背景

实际上，玉石/派格语法通过使用3种语法来允许纯HTML（或任何其他纯文本），您可以在项目网站上的引用。

点语法（也称为 阻止标签）

 微升。 
< li>< a href =＃book-a>书A< / a>< / li> 
< li>< a href =＃book-b>书B< / a>< / li> 
  

管道语法（也称为 Piped Text ）

  ul 
 | < li>< a href =＃book-a>书A< / a>< / li> 
 | < li>< a href =＃book-b>书B< / a>< / li> 
  

标签语法（也称为标签内嵌），只需在标签后放置一些内容，可以也可以这样做：

  ul 
 li< a href =＃book-a> Book A& / A> 
  

这将呈现

 < ul>< li>< a href =＃book-a>书A< / a>< / li>< / ul> 
  

问题

回到你的问题，您的样本

 < div class =someClass> 
< h3> ＃{book.name}< / h3> 
< / div> 
  

可以像

  .someClass 
 h3 = book.name 
  

其中我觉得很可读，所以在这种情况下，你应该考虑一个不好的做法，编写原始的HTML，但并不总是。

IMO

国际海事组织，常识是最好的做法。也许我会考虑使用一大堆HTML来在页面上插入一个小部件，比如YouTube视频或者一个自定义的Google地图< iframe>。

 < iframe width =425height =350frameborder =0scrolling =nomarginheight =0marginwidth =0src =https://maps.google。 ？ES /地图/ MS MSA = 0&放大器;放大器; MSID = 217708588685721440865.0004d1d4faefdd11adf39&放大器;放大器，即= UTF8&放大器;放大器; 11 = 43.167638，-7.838262&放大器;放大器; SPN = 1.010793,0.991384&放大器;放大器; T = M&放大器;放大器;输出=嵌入>< / iframe中> 
 
< iframe width =420height =315src =http://www.youtube.com/embed/_Vkm2nMM3-Qframeborder =0allowfullscreen>< /的iframe> 
  

如上所述，这里使用属性语法。结果是几乎相同，并且离开原始的html更快。

  iframe（width =425，height = 350，frameborder =0，scrolling =否，marginheight =0，marginwidth =0src =https://maps.google.es/maps/ms?msa=0&msid = 217708588685721440865.0004d1d4faefdd11adf39& ie = UTF8& amp; amp; amp = amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; amp; iframe（width =420，height =315，src =http://www.youtube.com/embed/_Vkm2nMM3-Q，frameborder =0，allowfullscreen）
  

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.

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:

<div class="someClass">    
  <h3> #{book.name} </h3>
</div>

解决方案

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.

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

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.

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>.

<iframe width="425" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://maps.google.es/maps/ms?msa=0&amp;msid=217708588685721440865.0004d1d4faefdd11adf39&amp;ie=UTF8&amp;ll=43.167638,-7.838262&amp;spn=1.010793,0.991384&amp;t=m&amp;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.

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)

这篇关于在玉中使用HTML是不是很糟糕的做法？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！