我喜欢编写HTML并且倾向于用很少的JavaScript编写平面网站。我一直在想着编写一种新的“语言”,使用XPath和XMLNS来引用其他文档。
我一直在玩我想要编写HTML的方法,然后运行构建工具来扩展和构建完整的文档。
有没有这样的工具呢?我宁愿重新使用或学习已经存在的工具。我怀疑我错过了一个已经做过类似事情的明显或常用工具。
这通常是我想写HTML(或HTMPL
,就像我一直在调用它,因为它是模板)。
<html xmlns:custom="card.htmpl">
<custom:card img="/path/to/image.jpg">
<title>Title content here</title>
This is the card
</custom:card>
</html>
<div class="card">
<img src="[[//card@img]]" />
<div class="title">The title is: [[//card/title/text()]]</div>
<div class="content">[[//card/text()]]</div>
</div>
删除了额外的空格
<html>
<div>
<img src="/path/to/image.jpg" />
<div class="title">The title is: Title content here</div>
<div class="content">This is the card</div>
</div>
</html>
XSLT旨在完成这项工作。
XSLT有一个名为“简化样式表”的概念,它设计用于你想要的非常简单的模板,但很少使用简化的样式表,因为大多数人发现它们最终需要完整的语言。
你的例子可以用XSLT 3.0编写(使用简化的样式表),如下所示:
data.hml
<custom:card img="/path/to/image.jpg">
<title>Title content here</title>
This is the card
</custom:card>
template.xsl
<html xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
xsl:version="3.0" expand-text="yes">
<div class="card">
<img src="{//card/@img}" />
<div class="title">The title is: {//card/title/text()}</div>
<div class="content">{//card/text()}</div>
</div>
</html>
但正如我所说,这种使用XSLT的方式并不是很受欢迎。
还有其他(非标准化)模板语言,如Velocity和Freemarker。选择https://en.wikipedia.org/wiki/Comparison_of_web_template_engines,或者如果您觉得需要在列表中添加另一个,请自行设计。