Question

我正在尝试使用clojure.browser.dom生成以下HTML片段，但它看起来与hiccup不同，

<div data-role="controlgroup">
<a href="index.html" data-role="button">Yes</a>
<a href="index.html" data-role="button">No</a>
<a href="index.html" data-role="button">Maybe</a>
</div>

生成HTML元素的正确表示法是什么？使用，

[:div {:data-role "controlgroup"} ...]

无法生成，

<div data-role="controlgroup">

Answer 1

另请参阅dommy，它基本上是murtaza52建议的crate（hiccup的cljs版本）的优化版本。

Answer 2

看看箱子 - https://github.com/ibdknox/crate - 它是cljs打嗝的一个端口。

另请参阅enfocus，它是enlive的实现 - https://github.com/cgrand/enlive

Answer 3

在https://github.com/flurfunk/flurfunk-web查看flurfunk的网络前端。他们似乎已经推出了自己的ClojureScript库来生成html，界面在性质上与打嗝类似。

以下是https://github.com/flurfunk/flurfunk-web/blob/master/src/cljs/flurfunk/web/core.cljs的摘录：

(ns flurfunk.web.core
  (:require [flurfunk.web.dom-helpers :as dom]))
(defn- create-dom []
  (dom/build [:div#content
               [:h1
                 [:a {:href "http://flurfunk.github.com"} title]]
               [:div#messages
                 [:div#message-input
                   [:div
                     [:label "Your name:"]
                     [:input#author-name-input {:type "text"}]]
                   [:textarea#message-textarea]
                   [:button#send-button "Send message"]
                   [:div#waiting-indication]]
                 [:div#hidden-channels
                   [:label "Hidden channels:"]
                   [:ul#hidden-channel-list]]
                 [:div#message-list]]
               [:button#load-more-button "Load more messages"]]))

使用ClojureScript生成HTML

3 个答案: