html - scalatags JsDom 与 Text

标签 html scala scalatags

scalatags.Text.all._scalatags.JsDom.all._ 包有何区别和用途?

official scalatags tutorial您可以阅读:

// import scalatags.Text.all._
// OR
// import scalatags.JsDom.all._
html(
  head(
    script(src:="..."),
    script(
      "alert('Hello World')"
    )
  ),
  body(
    div(
      h1(id:="title", "This is a title"),
      p("This is a big paragraph of text")
    )
  )
)
And turns them into HTML like this:

<html>
    <head>
        <script src="..."></script>
        <script>alert('Hello World')</script>
    </head>
    <body>
        <div>
            <h1 id="title">This is a title</h1>
            <p>This is a big paragraph of text</p>
        </div>
    </body>
</html>

最佳答案

scalatags 文档中 DOMBackend 部分描述了差异和 Internals

简而言之,当使用scalatags.Text包时,结构直接渲染为String,但是当使用scalatags.JsDOM包时,结构渲染到 org.scalajs.dom.raw.Element 的子类型(位于 scalatags 之外 - 它是 scalajs 库的一部分)。处理 Element 时,可以进一步 manipulate dom structure very low level of abstraction

这里,当使用scalatags.Text.时,h1渲染为String:

    import scalatags.Text.all._
    val x: String = h1("some header").render
    //x is a String

但是在这里,当使用 scalatags.JsDom 时,h1 呈现为 org.scalajs.dom.raw.HTMLHeadingElement:

    import scalatags.JsDom.all._

    val x: Heading = h1("some header").render
    //x is type of Heading, which is defined as:
    //type Heading = raw.HTMLHeadingElement
    //raw.HTMLHeadingElement is org.scalajs.dom.raw.HTMLHeadingElement

关于html - scalatags JsDom 与 Text,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39684711/

相关文章:

html - 如何让标题中的组件完美地结合在一起

javascript - 网页游戏开发的层次结构

scala - 编译器无法为无形的 LabelledGeneric 找到正确的隐式

parsing - 接近 Scala 中的文本解析

iphone - 隐藏 iPhone HTML5 视频播放按钮

html - 表单元素和链接具有相同高度的最小 CSS

scala - 从 RichPipe 获取一个值

scala.js - 如何在 Scalatags 中添加 "data-"属性

scala - 如何从传递给 scalatags 的事件处理程序访问 'this' 元素?