← Back to context

Comment by agumonkey

3 years ago

I wonder why there's never been a

    <calc> /* ... compute and return dom element */ </calc>

Basically what php does but with structure and objects instead of a bytestream

in HTML. Or maybe it's been discussed but got left out

3 comments

agumonkey

Reply
marwis  3 years ago

It's always been possible:

<script>document.write(`<p>foo</p>`)</script>

  • agumonkey  3 years ago

    Good point, but it's very different in terms of thinking. Same as structural versus string macros in programming languages.

    • marwis  3 years ago

      You can do it with custom elements, e.g.

            <dom-calc>
        const p = document.createElement('button');
        p.innerText = 'hi';
        p.onclick = () => alert('hi');
        return p;
      </dom-calc>

      For something like:

        class CalcElement extends HTMLElement {
    connectedCallback() {
      setTimeout(() => {
        const fn = new Function(this.innerText);
        this.replaceWith(fn());
      }, 0);
    }
  }

  customElements.define('dom-calc', CalcElement);