Module Brr.El
DOM elements.
The type El.t technically represents DOM Node objects. However most of DOM processing happens on elements. So we make it as if El.t values were just elements and most of the functions of this module will fail on text nodes. Except on El.children where you may see them you'll likely never run into problems. The El.is_txt function can be used to check for textiness.
See Brr.Document.t this is a forward declaration.
See Brr.Window.t this is a forward declaration.
type tag_name = Jstr.tThe type for element tag names.
The type for elements. Technically this is a DOM Node object. But we focus on DOM manipulation via elements, not the various kind of nodes that may exist.
val v :
?d:Brr.El.document ->
?at:Brr.At.t list ->
Brr.El.tag_name ->
Brr.El.t list ->
Brr.El.tv ?d ?at name cs is an element name with attribute at (defaults to []) and children cs. If at specifies an attribute more than once, the last one takes over with the exception of At.class' and At.style whose occurences accumulate to define the final value. d is the document on which the element is defined it defaults Brr.G.document.
val txt : ?d:Brr.El.document -> Jstr.t -> Brr.El.ttxt s is the text s. d is the document on which the element is defined it defaults Brr.G.document. WARNING This is not strictly speaking an element most function of this module will error with this value.
val txt' : ?d:Brr.El.document -> string -> Brr.El.ttxt' s is txt (Jstr.v s).
val sp : ?d:Brr.El.document -> unit -> Brr.El.tsp () is El.txt Jstr.sp
val nbsp : ?d:Brr.El.document -> unit -> Brr.El.tnbsp () is El.txt' "\u{00A0}".
val is_txt : Brr.El.t -> boolis_txt e is true iff e is a text node. Note that in this cases many of the function below fail.
val is_el : Brr.El.t -> boolis_el e is true iff e is an element node.
val tag_name : Brr.El.t -> Brr.El.tag_namename e is the tag name of element e lowercased. For is_txt nodes this returns "#text".
val has_tag_name : Brr.El.tag_name -> Brr.El.t -> boolhas_tag_name n e is Jstr.equal n (name e).
txt_text e is the text of e if e is a text node and the empty string otherwise.
val document : Brr.El.t -> Brr.El.documentdocument e is the document of e.
val as_target : Brr.El.t -> Brr.Ev.targetas_target d is the document as an event target.
Element lookups
See also document element lookups.
els_by_class ~root c are the elements with class c that are descendents of root (defaults to Document.root).
find_by_tag_name ~root n are the elements with tag name t that are descendents of root (defaults to Document.root).
find_first_by_selector ~root sel is the first element selected by the CSS selector sel that is descendent of root (defaults to Document.root).
fold_find_by_selector ~root f sel acc folds f over the elements selected by the CSS selector sel that are descendent of root (defaults to Document.root).
Parent, children and siblings
children e are e's children. Warning, unless only_els is true (defaults to false) not all returned elements will satisfy is_el here.
append_children e l appends l to e's children.
previous_sibling e is e's previous sibling element (if any).
insert_siblings loc e l inserts l before, after or instead of element e according to loc.
val remove : Brr.El.t -> unitremove e removes e from the document.
Attributes and properties
val at : Brr.At.name -> Brr.El.t -> Jstr.t optionat a e is the attribute a of e (if any).
val set_at : Brr.At.name -> Jstr.t option -> Brr.El.t -> unitset_at a v e sets the attribute a of e to v. If v is None the attribute is removed. If a is empty, this has not effect.
Some attributes are reflected as JavaScript properties in elements see here for details. The following gives a quick way of accessing these properties for elements whose interface which, unlike Brr_canvas.Canvas and Brr_io.Media.El, are not necessarily bound by Brr for the time being (or will never be).
module Prop : sig ... endElement properties.
val prop : 'a Brr.El.Prop.t -> Brr.El.t -> 'aprop p e is the property p of e if defined and false, 0, 0. or Jstr.empty as applicable if undefined.
val set_prop : 'a Brr.El.Prop.t -> 'a -> Brr.El.t -> unitset_prop p v o sets property p of e to v.
Classes
set_class c b e sets the membership of e to class c to b.
Style
module Style : sig ... endStyle property names.
val computed_style :
?w:Brr.El.window ->
Brr.El.Style.prop ->
Brr.El.t ->
Jstr.tcomputed_style ?w p e is the computed style property p of e in window w (defaults to G.window).
val inline_style : Brr.El.Style.prop -> Brr.El.t -> Jstr.tinline_style p e is the inline style property p of e.
val set_inline_style :
?important:bool ->
Brr.El.Style.prop ->
Jstr.t ->
Brr.El.t ->
unitset_inline_style ~important p v e sets the inline style property p of e to v with priority important (defaults to false).
val remove_inline_style : Brr.El.Style.prop -> Brr.El.t -> unitremove_inline_style p e removes the inlie style property p of e.
Layout
The inner bound of an element includes its content and padding but not its border. We use the client* properties to get it. These only have integral CSS pixel precision.
val inner_x : Brr.El.t -> floatinner_x e is the horizontal coordinate in the viewport of e's inner bound. Add Window.scroll_x to get the position relative to the document.
val inner_y : Brr.El.t -> floatinner_y e is the vertical coordinate in the viewport of e's inner bound. Add Window.scroll_y to get the position relative to the document.
val inner_w : Brr.El.t -> floatinner_w e is e's inner bound width.
val inner_h : Brr.El.t -> floatinner_h e is e's inner bound height.
The bound of an element includes its content, padding and border. We use getBoundingClientRect to get it. These have CSS subpixel precision.
val bound_x : Brr.El.t -> floatbound_x e is the horizontal coordinate in the viewport of e's bound. Add Window.scroll_x to get the position relative to the document.
val bound_y : Brr.El.t -> floatbound_y e is the vertical coordinate in the viewport of e's bound. Add Window.scroll_y to get the position relative to the document.
val bound_w : Brr.El.t -> floatbound_w e is e's bound width.
val bound_h : Brr.El.t -> floatbound_h e is e's bound height.
Scrolling
val scroll_x : Brr.El.t -> floatscroll_x e is the number of pixels scrolled horizontally.
val scroll_y : Brr.El.t -> floatscroll_y e is the number of pixels scrolled vertically.
val scroll_w : Brr.El.t -> floatscroll_w e is the minimum width the element would require to display without a vertical scrollbar.
val scroll_h : Brr.El.t -> floatscroll_h e is the minimum height the element would require to display without a vertical scrollbar.
val scroll_into_view : ?align_v:[ `Start | `End ] -> Brr.El.t -> unitscroll_into_view ~align e scrolls e into view. If align_v is `Start (default) the top of the element is align with to to the top of the scrollable area. If align_v is `End the bottom of the element is aligned with the bottom of the scrollable area.
Focus
val has_focus : Brr.El.t -> boolhas_focus e is true if e has focus in the document it belongs to.
val set_has_focus : bool -> Brr.El.t -> unitset_has_focus b e sets the focus of e to b in the document it belongs do.
Pointer locking
val is_locking_pointer : Brr.El.t -> boolis_locking_pointer e is true if e is the element which locked the pointer.
val request_pointer_lock : Brr.El.t -> unit Fut.or_errorrequest_pointer_lock e requests the pointer to be locked to e in the document it belongs to. This listens on the document for the next Ev.pointerlockchange and Ev.pointerlockerror to resolve the future appropriately.
Fullscreen
Fullscreen navigation enum.
The type for FullscreenOptions objects.
val fullscreen_opts :
?navigation_ui:Brr.El.Navigation_ui.t ->
unit ->
Brr.El.fullscreen_optsfullscreen_opts () are options for fullscreen with given parameters.
val request_fullscreen :
?opts:Brr.El.fullscreen_opts ->
Brr.El.t ->
unit Fut.or_errorrequest_fullscreen e requests to make the element to be displayed in fullscreen mode.
Click simulation
val click : Brr.El.t -> unitclick e simulates a click on e.
val select_text : Brr.El.t -> unitselect_text e selects the textual contents of e. If the DOM element e has no select method this does nothing.
Element interfaces
Some interfaces are in other modules. See for example Brr_io.Media.El for the media element interface, Brr_canvas.Canvas for the canvas element interface and Brr_io.Form for the form element interface.
module Input : sig ... endThe HTML input element interface .
Element names and constructors
See the MDN HTML element reference.
Convention. Whenever an element name conflicts with an OCaml keyword we prime it, see for example object'.
module Name : sig ... endElement names
type cons =
?d:Brr.El.document ->
?at:Brr.At.t list ->
Brr.El.t list ->
Brr.El.tThe type for element constructors. This is simply v with a pre-applied element name.
type void_cons = ?d:Brr.El.document -> ?at:Brr.At.t list -> unit -> Brr.El.tThe type for void element constructors. This is simply v with a pre-applied element name and without children.
val a : Brr.El.consval abbr : Brr.El.consval address : Brr.El.consval area : Brr.El.void_consval article : Brr.El.consval aside : Brr.El.consval audio : Brr.El.consval b : Brr.El.consval base : Brr.El.void_consval bdi : Brr.El.consval bdo : Brr.El.consval blockquote : Brr.El.consval body : Brr.El.consval br : Brr.El.void_consval button : Brr.El.consval canvas : Brr.El.consval caption : Brr.El.consval cite : Brr.El.consval code : Brr.El.consval col : Brr.El.void_consval colgroup : Brr.El.consval command : Brr.El.consval datalist : Brr.El.consval dd : Brr.El.consval del : Brr.El.consval details : Brr.El.consval dfn : Brr.El.consval div : Brr.El.consval dl : Brr.El.consval dt : Brr.El.consval em : Brr.El.consval embed : Brr.El.void_consval fieldset : Brr.El.consval figcaption : Brr.El.consval figure : Brr.El.consval form : Brr.El.consval h1 : Brr.El.consval h2 : Brr.El.consval h3 : Brr.El.consval h4 : Brr.El.consval h5 : Brr.El.consval h6 : Brr.El.consval head : Brr.El.consval header : Brr.El.consval hgroup : Brr.El.consval hr : Brr.El.void_consval html : Brr.El.consval i : Brr.El.consval iframe : Brr.El.consval img : Brr.El.void_consval input : Brr.El.void_consval ins : Brr.El.consval kbd : Brr.El.consval keygen : Brr.El.consval label : Brr.El.consval legend : Brr.El.consval li : Brr.El.consval link : Brr.El.void_consval map : Brr.El.consval mark : Brr.El.consval meta : Brr.El.void_consval meter : Brr.El.consval noscript : Brr.El.consval object' : Brr.El.consval ol : Brr.El.consval optgroup : Brr.El.consval option : Brr.El.consval output : Brr.El.consval p : Brr.El.consval param : Brr.El.void_consval pre : Brr.El.consval progress : Brr.El.consval q : Brr.El.consval rp : Brr.El.consval rt : Brr.El.consval ruby : Brr.El.consval s : Brr.El.consval samp : Brr.El.consval script : Brr.El.consval section : Brr.El.consval select : Brr.El.consval small : Brr.El.consval source : Brr.El.void_consval span : Brr.El.consval strong : Brr.El.consval style : Brr.El.consval sub : Brr.El.consval summary : Brr.El.consval sup : Brr.El.consval table : Brr.El.consval tbody : Brr.El.consval td : Brr.El.consval textarea : Brr.El.consval tfoot : Brr.El.consval th : Brr.El.consval thead : Brr.El.consval time : Brr.El.consval title : Brr.El.consval tr : Brr.El.consval track : Brr.El.void_consval u : Brr.El.consval ul : Brr.El.consval var : Brr.El.consval video : Brr.El.consval wbr : Brr.El.void_cons