javascript - Scalatags 生成 HTML 还是 Javascript？

Question

我看到一些 Scala 代码似乎可以生成 HTML...

  def pagePlay: TypedTag[dom.raw.HTMLElement] = div{
    val levels = Array(
      (10, "Easy game; you are allowed 10 misses."),
      (5, "Medium game; you are allowed 5 misses."),
      (3, "Hard game; you are allowed 3 misses.")
    )
    div(
      p("Inspired from ")(a(href:="http://www.yiiframework.com/demos/hangman/", target:="_blank","Yii's demo")),
      p("This is the game of Hangman. You must guess a word, a letter at a time.\n" +
        "If you make too many mistakes, you lose the game!"),
      form(id := "playForm")(
        for((level,text) <- levels) yield {
          val levelId = s"level_${level}"
          div(`class`:="radio")(
            input(id:=levelId, `type`:="radio", name:="level", onclick:={ ()=>
              Model.level() = level
            }, {if(level == Model.level()) checked:="checked"}),
            label(`for`:=levelId, style:="padding-left: 5px")(text)
          )
        }, br,
        input(`type`:="button", value:="Play!", `class`:="btn btn-primary", onclick:={ () =>
          if(Model.level() > 0) {
            Model.start()
            goto(pageGuess)
          }else{
            dom.alert("Please select level!")
          }
        })
      )
    )
  }

^ 这段 ScalaTag 代码实际上是生成可由不带 JavaScript 支持的简单网络爬虫读取的 HTML，还是生成修改 DOM 以生成 div 和段落之类的 Javascript？

我尝试阅读文档，但对于 div 和 p，只有“Pattern: div: Tags.this.ConcreteHtmlTag[html.Div]”

Answer 1

它同时使用两者，至少现在是这样:

来自文档:

Although Scalatags was originally a HTML-String generation library, it now
ships with an additional backend that runs only on ScalaJS.

此外:

The DOM backend provides an additional method .render on all Scalatags fragments, which converts the fragment into a DOM tree:

val elem = div.render
assert(elem.children.length == 0)
elem.appendChild(p(1, "wtf", "bbq").render)
assert(elem.children.length == 1)
val pElem = elem.children(0).asInstanceOf[Paragraph]
assert(pElem.childNodes.length == 3)
assert(pElem.textContent == "1wtfbbq")
As you can see, you can manipulate DOM elements directly, calling standard DOM APIs like .children, .appendChild, etc.

As you can see, you can manipulate DOM elements directly, calling standard DOM APIs like .children, .appendChild, etc. Which as you know are Javascript!