Basic Nodes

The following are standard HTML nodes used to represent static content.

#Text nodes

A text node represents a string of text within the DOM. Text nodes can be left as a Text node or converted into a Variable node.

#Example input

I'm text

#AST

{
  "type": "text",
  "value": "I'm text"
}

#Element nodes

An element node represents an HTML container, e.g. div, p, html. Elements can contain other nodes within the key children. Processed element nodes can be left as an element node, converted into a conditional node, or converted into a loop node. Some elements are considered to be a markdown block or be part of an inline markdown block which is converted into a Variable node.

#Example input

<div><img src="goose.png"></div>

#AST

{
  "type": "element",
  "name": "div",
  "attrs": {},
  "children": [
    {
      "type": "element",
      "name": "img",
      "attrs": {
        "img": {
          "type": "attribute",
          "name": "src",
          "value": "goose.png"
        }
      },
      "children": []
    }
  ]
}

#Comment nodes

A comment node represents a string of text printed between . Comments are never turned into conditionals, loops or variables.

#Example input

<!-- I'm a comment -->

#AST

{
  "type": "comment",
  "value": "I'm a comment"
}

#Doctype nodes

A doctype node represents how a document should be processed by the HTML processor. Doctype nodes are never turned into conditionals, loops or variables.

#Example input

<!doctype html>

#AST

{
  "type": "doctype",
  "value": "html"
}

#Cdata nodes

Unused and largely ignored, see MDN.

#Example input

<![CDATA[ … ]]>

#AST

{
  "type": "cdata",
  "value": "…"
}