Dom.Element is an opaque type that stores an internal record, defined here. The internal record contains all of the data needed to construct an Elm Html node. By using a record to temporarily store data about a node, we can partially construct that node with some data, but delay building it until all of the data has been assembled.

A new Element record is created when you call the element function. The record is then rendered to Html when it is added as a child element to another Element record, or when it is passed as an argument to the render function.

Because rendering is built into the functional development pattern of this package, it is often only necessary to call the render function once, on the root node of your DOM tree. (One notable exception is when you want to use the Html.Lazy optimization; see here for a very simple example of how you would implement that with this package).

Constructor for Element records. The string argument provides the HTML tag.

Convert an Element record to Elm Html. This function only needs to be called once, on the root node of your DOM tree.

Sets or resets the id attribute

Adds a class name to the current list

Adds a style key/value pair to the current list

Adds an attribute to the current list

Note: For complicated reasons, there is more than one VirtualDom primitive for assigning attributes to DOM elements. Unless you are really confident in what you are doing, I recommend using the constructors in Html.Attributes and Html.Events (or Svg.Attributes and Svg.Events) to ensure that the implementation used internally best matches the current spec.

Adds an action to the current list of event listeners

As defined here, an action is a simple event listener that does nothing except send a message to your Elm program's update function when the specified event is triggered. This is useful for responding to events like "click", "mouseover", "mouseout", and so on.

Event names in the DOM API are documented here.

Adds an input handler for form elements to the current list of event listeners

Internally, this function is equivalent to Html.Events.onInput.

Adds value change handler for form elements to the current list of event listeners

This handler captures event.target.value on a "change" event, which can sometimes be useful when designing form interaction. Unlike the default input handler, it does not invoke the "stopPropagation" option.

Adds a toggle handler for checkboxes and radio buttons to the current list of event listeners

Internally, this function is equivalent to Html.Events.onCheck.

Adds a string to the end of the current text

Adds a string to the beginning of the current text

Renders an element (the first argument) and adds it to the end of the current child list (in the second argument)

Renders an element and adds it to the beginning of the current child list

Adds an Html node to the end of the the current child list

Adds an Html node to the beginning of the the current child list

Adds a list of class names to the current list

Adds a list of style key/value pairs to the current list

Adds a list of attributes to the current list

Renders a list of elements and adds them to the end of the current child list

Renders a list of elements and adds them to the beginning of the current child list

Adds a list of Html nodes to the end of the the current child list

Adds a list of Html nodes to the beginning of the the current child list

Adds a class name to the current list when the condition is True

Adds a style key/value pair to the current list when the condition is True

Adds an attribute to the current list when the condition is True

Adds a list of class names to the current list when the condition is True

Adds a list of style key/value pairs to the current list when the condition is True

Adds a list of attributes to the current list when the condition is True

Adds an action to the current list of event listeners when the condition is True

Adds a string to the end of the current text when the condition is True

Adds a string to the beginning of the current text when the condition is True

Renders an element and adds it to the end of the current child list when the condition is true

Renders a list of elements and adds them to the end of the current child list when the condition is True

Renders an element and adds it to the beginning of the current child list when the condition is True

Renders a list of elements and adds them to the beginning of the current child list when the condition is True

Removes all instances of a class name from the current list

Removes all instances of a style key from the current list

Removes all instances of a key (event name) from the current list of event listeners

Replaces the current list of class names with a new list

Replace the current list of style key/value pairs with a new list

Replaces the current list of attributes with a new list

Replaces the current text with new text

Replaces the current text with new text when the condition is True

Renders a list of elements replaces the current child list with the rendered list

Replaces the current child list with the rendered list when the condition is True

Replaces the current child list with a list of Html nodes

Sets or resets the HTML tag

This is generally unnecessary because the tag is set by the element constructor; it may be useful to have when working with component libraries based on this package.

Sets the XML namespace as described here

This is required when using Element records to construct SVG nodes.

Sets or resets the current child list from a keyed list of element records

This is a performance optimization that will flag the rendering function to use keyedNode or keyedNodeNS. See here for details.

Sets or resets the current child list from a keyed list of Html nodes

This is a performance optimization that will flag the rendering function to use keyedNode or keyedNodeNS. See here for details.

Adds an input handler for form elements to the current list of event listeners

The parser works as follows: when the "input" event is triggered, a String is captured from event.target.value; then the parsing function is applied before the resulting value is passed to your Elm program's update function. For simple error handling, it is recommended to have your parsing function return a Maybe value.

Adds a value change handler for form elements to the current list of event listeners

This handler captures event.target.value on a "change" event, which can sometimes be useful when designing form interaction. Unlike the default input handler, it does not invoke the "stopPropagation" option.

The parser works as follows: when the "change" event is triggered, a String is captured from event.target.value; then the parsing function is applied before the resulting value is passed to your Elm program's update function. For simple error handling, it is recommended to have your parsing function return a Maybe value.

Adds a listener to the current list that will invoke a custom Json decoder when the specified event is triggered.

The VirtualDom implementation for this function uses the Handler type Normal.

Adds a listener to the current list (via addListener) when the condition is True

Adds an action to the current list of event listeners using the Handler type MayStopPropagation with the option set to True

Adds a listener to the current list that will invoke a custom Json decoder when the specified event is triggered

The VirtualDom implementation for this function uses the Handler type MayStopPropagation with the option set to True.

Adds an action to the current list of event listeners using the Handler option MayPreventDefault with the option set to True

Adds a listener to the current list that will invoke a custom Json decoder when the specified event is triggered

The VirtualDom implementation for this function uses the Handler type MayPreventDefault with the option set to True.

Adds an action to the current list of event listeners using the Handler type Custom with both options set to True

Adds a listener to the current list that will invoke a custom Json decoder when the specified event is triggered

The VirtualDom implementation for this function uses the Handler type Custom with both options set to True.

Returns a record containing the Element's internal data