如果我们一直有更好的HTML-in-JS语法会怎么样？

⇦我有一个理论，认为1995年犯了一个严重的错误--决定不用一种整洁、简洁和声明的方式来表示JavaScript中的HTML元素。

在这篇文章中，我将描述事情的现状，展示几个对javascript语法的非常小的补充，它们可能已经产生了很大的不同，然后再谈一谈它带来的影响。在这篇文章中，我将描述目前的状况，展示几个对javascript语法的非常小的补充，它们可能会带来很大的不同，然后再谈论其影响。

const myLi=Name=>；`<；li>；我的名字是<；em>；${name}<；/em>；<；/li>；`const Myul=Names=>；`<；ul class="；my-ul"；>；${names.map(myLi).join('；'；)}<；/ul>；`。

这是垃圾，原因很明显--编写字符串很容易出错，没有输入/打印等等。然后我们必须将它们转换为不太优雅的元素：

当然，也有各种各样的库，从字符串模板库(如把手)到可编译的库(如.jsx)。

类型HtmlNode={Tag：String，Attributes：{[Key：String]：String|Function}，子项：(HtmlNode|String)[]}。

{Tag："；Button"；，Attributes：{"；id"；："；Baz"；，"；class"；："；Foo bar"；，"；data"；："；1"；，"；onclick"；：F，}，Children：["；Hello"；，{tag："；em"；，属性：{}，子项：["；here"；]，}]}。

HTML(lang="；EN"；)head title=pageTitle body h1.一些类Jade-node模板引擎#CONTAIN-如果(YouAreUsingJade)你很棒

这看起来不错，主要问题是我们在编程构造上有点局限，例如，我们如何使<；h1>；在某些条件下隐藏额外的类？Jade通过3种不同的方式指定类来绕过这个问题。与其想出一种特殊的模板语言，不如稍微扩展一下普通的js语法。

好的，让我们来看看上面的例子。我不会过多地强调这一点的正确性，因为我并不是建议我们更改所有代码，而只是更改可能的代码。

因此，下面是允许现有js对象语法以相当简洁的方式表示html节点的事项清单：

除了键：值对之外，对象还允许拖尾值。我想可以用foo.~或一些特殊的构造来访问它们。

它们获得一个可选标签(在本例中为按钮)。如果您做过很多JSON反序列化工作，那么标记似乎是个好主意(它们可以帮助您将数据映射到类型)，看看它们在edn-nices中是如何使用的(通过自定义命名空间)。

就是这样。我们的javascript将使用它作为主数据类型(其他所有内容都将保持不变)。也许，我们会开始(重新)编写所有类似XML的html，以便也使用这种语法。

Const Names=["；Barry&34；，"；Lynette&34；]Const myLi=name=>；li{'；我的名字是'；em{name}}const Myul=Names=>；ul{class：['；my-ul'；].names.map(MyLi)}app.get('；/'；，(req，res)=>；res.。

正文{class："；language-javascript"；a{href："；index.html"；img{style："；Height：2EM"；src："；pic.png"；}"；⇦"；}H1{"；如果我们最好使用代码{"；html"；}"；-in-&##。}句法一直？p我有一个理论，1995年犯了一个严重的错误."；}}。

JSON和HTML之间没有区别。(API设计的下游后果会是什么？)。

我们的html只是结构化的数据，这会不断地让我们目不转睛地看着我们。

我们就不会有像淘汰赛(还记得那一次吗？)那样在html中使用奇怪逻辑的年代了。

我们在1996年可能会有类似的反应，而那只会是废话，很明显，我们会像诅咒一样做这件事。(这句话的意思是：“如果是在1996年，我们可能会有类似的反应，而那只会是废话，显然我们会像诅咒一样做这件事)。”

我们本可以拥有一个可组合的库，用于日期选择器、情态函数等，而不必使用这个庞大的库。

没有人会使用handlebar/jinsa/twig string munging库来制作html(至少在节点世界中是这样)。

html<；form>；->；json阻抗不匹配(尝试将嵌套数据描述为表单)现在可能已经正确排序。

本世纪初，每个人的一切都是XML的计划可能会更成功。(这会是件好事吗？)

我认为这是一个足够好的解决方案，但是它与您的标准js对象的语法不同这一事实鼓励人们将VDOM对象视为不是普通数据，但事实并非如此。记谱法本身就是一种思维工具。

我们的另类历史从未发生过，我更喜欢无聊的超级脚本风格，一切都是代码。