Shared vars [Dev]

Added in V4

Shared vars let you connect the content of a element to others

Syntax

Source

Source element (one):

<input htms-out="name">

Source element with htms-out, then name of variable as value

Destination

Destination element (multiple):

<p htms-in="name"></p>

Destination element with htms-in, then name of variable as value

Flow chart of dynamic vars

Technical

On update all elements with htms out will get a event listener on input and a mutation observer

For some elements it will modify the value attribute instead of the default innerHTML, these are:

• input

• textarea

• select

• meter

• progress

input textarea and select