no-framework.purs

module Main where

import Prelude

import Effect (Effect)
import Effect.Console (log)
import Web.HTML as Web
import Web.HTML.Window as Window
import Web.HTML.HTMLDocument as HTMLDocument
import Web.DOM.ParentNode
  ( ParentNode
  , QuerySelector(..)
  , querySelector
  )
import Data.Maybe (Maybe(..))
import Web.DOM.Internal.Types (Element)
import Web.DOM.Document (createElement)
import Web.DOM.Node (setTextContent, appendChild)
import Web.DOM.Element as Element

main :: Effect Unit
main = do
  window <- Web.window
  document <- Window.document window
  let parentNode = HTMLDocument.toParentNode document
  appElement <- getElement parentNode "#app"
  h1 <- createElement "h1" (HTMLDocument.toDocument document)
  setTextContent "Hello, World" (Element.toNode h1)
  case appElement of
    Nothing -> log "No app element"
    Just app -> appendChild (Element.toNode h1) (Element.toNode app)

getElement
  :: ParentNode
  -> String
  -> Effect (Maybe Element)
getElement pNode selector =
  querySelector (QuerySelector selector) pNode