dashborg/hibiki: 无需Javascript完全由后端代码控制脚本的编写

Hibiki HTML 是一个强大的新 Web 框架，用于创建现代、动态的前端应用程序，无需JavaScript，可以完全由后端代码编写脚本和控制。
Hibiki HTML 兼容任何后端语言或框架、任何 CSS 框架以及任何现有的后端模板语言。
有关交互式演练，请查看 Hibiki HTML 交互式教程。
入门很容易。无需设置 JavaScript 堆栈，无需样板/脚手架，也无需下载和运行构建工具。只需在页面或模板顶部添加一个脚本标签：

<script src="https://cdn.hibikihtml.com/hibiki/latest/hibiki-prod.min.js"></script>
用 <template hibiki> 标签包裹你内容的任何部分，你就有了你的第一个 Hibiki HTML 应用程序。所有纯 HTML 内容都按原样呈现，并且因为 Hibiki HTML 使用浏览器的 HTML 解析器，它遵循与标准浏览器 HTML 相同的规则。

请注意，所有这些代码示例都可以在 Hibiki HTML Playground中查看和编辑。

<template hibiki>
  <h1 class="title">&x1f338; Hibiki HTML</h1>
  <p>Hibiki HTML <i>is</i> HTML</p>
</template>

Hibiki HTML 应用程序具有内置的前端数据模型。您可以使用<hibiki-data>标签使用任何 JSON 对象对其进行初始化。

<template hibiki>
  <hibiki-data>
    {"color": "blue", "name": "Mike"}
  </hibiki-data>
  <p>
    {{ $.name }}'s favorite color is 
    <span style="font-weight: bold; color: *$.color">{{ $.color }}</span>
  </p>
</template>

Hibiki HTML 支持完整的表达式语言，包括所有标准的条件和算术运算符。可以使用速记属性语法打开/关闭其他类class.[class-name]="true/false expression"。
 
为了更新数据（并动态更改内容），Hibiki HTML 支持handlers。基本处理程序响应click、mount、submit、change等事件。

<template hibiki>
  <hibiki-data>{"color": "blue"}</hibiki-data>
  <div class="box" style="background-color: *$.color; color: white">
    The color is {{$.color}}
  </div>
  <button class="button" click.handler="$.color = 'green'">Change Color</button>
</template>