Bind Statement

A binding statement is a JavaScript statement that contains one or more binding sources. A binding statement is evaluated once immediately, and then reevaluated whenever there is a change in the data it references.

The binding statement is typically used for DOM manipulation.

<!-- set visibility -->
<div bind-statement-1="thisElem.style.display = (#x ? 'block' : 'none')"></div>

<!-- style -->
<span bind-statement-1="thisElem.style.fontWeight = (#x ? 'bold' : 'normal')"></span>

<!-- toggle class -->
<div bind-statement-1="$(thisElem).toggleClass('active', #x)"></div>

<!-- change image src -->
<img bind-statement-1="thisElem.src = (#x ? 'checked.png' : 'unchecked.png')" />

<!-- set values of form elements -->
<input type="text" bind-statement-1="thisElem.value = #x" />
<input type="checkbox" bind-statement-1="thisElem.checked = #x" />

Note multiple statements can be placed on the same element, but each must have a different id. The statement-id can be any string. Here we use numbers, but you may want to use a descriptive string such as: bind-statement-set-visible or bind-statement-toggle-active.

http://jsfiddle.net/wxeh7jgh/