if attribute

TODO: work on it

if evaluates attribute contents to a value, if value is truthy, descendant nodes will be bound by Vanillin. Otherwise they will be removed. Variables are observed, so when falsy condition becomes truthy, descendants will be appended to element with if attribute again:

<script>
  var condition,
    runs = 0;
</script>
<div bind>"Runs: "+runs</div>
<label> <input type="checkbox" onchange="condition=this.checked" /> Condition </label>
<br />
<div if="condition">
  <span>Checkbox is checked</span>
  <script>
    console.log("it's run each time");
    // support for observing update expression (runs++) is not implemented yet.
    runs = runs + 1;
  </script>
</div>

Once script above is added to DOM, do remember the browser will execute all scripts natively. In last example it doesn't create and issue, because we use no implicit variables passed inside environment. Browser will create condition and run variables in browsers' native window. To make browser skip <script> execution, change <script>'s type attribute to anything but text/javascript, for instance text/metaes.