Page
Library
Module
Module type
Parameter
Class
Class type
Source
Dream_html.HTML
SourceAll standard HTML attributes and tags. Some attributes and tags have the same name, e.g. style
. To disambiguate them, attributes have a _
(underscore) suffix.
Standard, most non-deprecated attributes from https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes. Where an attribute name conflicts with an OCaml keyword, the name is suffixed with _
. Most attributes are constructed by passing in a value of some type.
All string-valued attributes allow formatting (interpolation):
div [id "section-%d" section_id] []
Or plain strings:
p [id "toast"] []
Most boolean attributes are plain values and don't need to be constructed with function calls:
input [required]
However, boolean attributes which may be inherited and toggled on/off in children, are constructed by passing in a value:
div [contenteditable true] [
p [] [txt "Edit me!"];
p [contenteditable false] [txt "Can't edit me!"];
]
Enumerated attributes accept specific values:
input [inputmode `tel]
An attribute that will not be rendered in the markup. Useful for conditional logic where you sometimes want to render an attribute and sometimes not.
p [if should_show then null_ else style_ "display:none"] [txt "Show and tell"]
val autocomplete :
[< `off
| `on
| `name
| `honorific_prefix
| `given_name
| `additional_name
| `honorific_suffix
| `nickname
| `email
| `username
| `new_password
| `current_password
| `one_time_code
| `organization_title
| `organization
| `street_address
| `address_line1
| `address_line2
| `address_line3
| `address_level4
| `address_level3
| `address_level2
| `address_level1
| `country
| `country_name
| `postal_code
| `cc_name
| `cc_given_name
| `cc_additional_name
| `cc_family_name
| `cc_number
| `cc_exp
| `cc_exp_month
| `cc_exp_year
| `cc_csc
| `cc_type
| `transaction_currency
| `transaction_amount
| `language
| `bday
| `bday_day
| `bday_month
| `bday_year
| `sex
| `tel
| `tel_country_code
| `tel_national
| `tel_area_code
| `tel_local
| `tel_extension
| `impp
| `url
| `photo
| `webauthn ]
to_attr
See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#loading. loading=eager
is the default so no need for specifically that value.
Note that the value of this attribute is not escaped.
Note that the value of this attribute is not escaped.
val role :
[ `alert
| `alertdialog
| `application
| `article
| `banner
| `button
| `cell
| `checkbox
| `columnheader
| `combobox
| `comment
| `complementary
| `contentinfo
| `definition
| `dialog
| `document
| `feed
| `figure
| `form
| `generic
| `grid
| `gridcell
| `group
| `heading
| `img
| `link
| `list
| `listbox
| `listitem
| `log
| `main
| `mark
| `marquee
| `math
| `menu
| `menubar
| `menuitem
| `menuitemcheckbox
| `menuitemradio
| `meter
| `navigation
| `none
| `note
| `option
| `presentation
| `progressbar
| `radio
| `radiogroup
| `region
| `row
| `rowgroup
| `rowheader
| `scrollbar
| `search
| `searchbox
| `separator
| `slider
| `spinbutton
| `status
| `suggestion
| `switch
| `tab
| `table
| `tablist
| `tabpanel
| `term
| `textbox
| `timer
| `toolbar
| `tooltip
| `tree
| `treegrid
| `treeitem ]
to_attr
Note that the value of this attribute is not escaped.
Note: this can't be restricted to just the allowed values for <input type>
, because it's used in other elements e.g. <link type>
.
HTML tags. Most (standard tags) are constructed by passing a list of attributes and a list of children:
div [id "my-div"] [p [] [txt "Hello"]]
Some (void elements) are constructed only with a list of attributes:
input [required; type_ "email"; name "email-addr"]
Finally, a few (text elements) are constructed with a list of attributes and a single format string child:
title [] "Document title"
title [] "My App ・ %s" page_name
script [] {|alert('Careful, this is not escaped :-)');|}
A tag that will not be rendered in the markup. Useful for containing a bunch of child nodes inside a single node without having to litter the DOM with an actual node. Also may be called 'splicing'.
null [
p [] [txt "This paragraph."];
p [] [txt "And this paragraph."];
p [] [txt "Are spliced directly into the document without a containing node."];
]
Also useful for constructing a completely empty node that is erased when printing:
null []
A <!DOCTYPE html>
declaration is automatically prefixed when this tag is printed.