← Back to index

How to access the window document object in ReScript?

Sat Dec 12 2020

ReScript version: bs-platform@8.3.3

As of this writing, there is an experimental DOM binding being developed.

However if your needs are simple you may like to create your own simple bindings.

Bindings

module Element = {
  type t
  @bs.send external innerText: (t, string) => unit = "innerText"
}

module Document = {
  type t
  @bs.send external getElementById: (t, string) => option<Element.t> = "getElementById"
}

module Window = {
  type t
  @bs.val external document: Document.t = "document"
}

Example usage

Window.document
->Document.getElementById("my-element")
->Belt.Option.map((el: Element.t) => el->Element.innerText("Hello"))

Here, we're using Belt.Option.map() to get access to the element value, but this could also be a switch statement.

This generates the JavaScript code:

Belt_Option.map(document.getElementById("my-element"), function (el) {
  el.innerText("Hello");
});