具体怎么回事儿，这里写得很清楚，就不啰嗦了：http://www.assembla.com/wiki/show/liftweb/Binding_via_CSS_Selectors。
有一点需要特别说明一下：为了彻底把页面设计和后台代码分离，我希望所有和页面布局展示的地方都用静态html实现，然后在snippet里面作binding。这时候就需要TemplateFinder了。
看下面这段：
1 2 3 4 5 6 7 8 9 10 | TemplateFinder.findAnyTemplate(List(TemplatesHidden, "edit")) map { "#real-content ^^")#> "true" andThen "#real-conent [id]" #> (EditPrefix + shortenedUrl.linkId.value) & "#edit-url [name]" #> urlId & "#edit-url [value]" #> shortenedUrl.originUrl.value & "#edit-url [id]" #>; urlId & "#save-button [onclick]" #> js.toJsCmd & "#save-button [id]" #> (EditPrefix + "submit-" + shortenedUrl.linkId.value) & "#cancel-button [onclick]" #> ("hide_edit('" + shortenedUrl.linkId.value + "')") & "#cancel-button [id]" #> (EditPrefix + "close-" + shortenedUrl.linkId.value) |
edit.html是一个完整的静态html，用来显示一个table，上面代码做的事情就是选中id为real-content的这个节点，然后对它做CSS的binding以实现动态页面。