Прочитав предыдущий топик (http://habrahabr.ru/blogs/javascript/96588/) в сознании всплыла старая идеи. Подход известный, но то ли у него есть минусы которые я не вижу, то ли мы с гуглом друг друга не поняли. В общем, готового решения я найти не смог, поэтому за пару часов набросал свое. Но так как наши пути с джава скриптом на данный момент разошлись, опробовать его в реальном проекте не получилось.
Интересны два вопроса, какие вам видятся минусы и встречали ли вы похожие решения для javascript?


Каждый тег (например div) предстает в виде функции Htmls.div которая
на выходе отдает HTMLElement, а на вход принимает любое количество аргументов типа:
1) Object — используется для определения атрибутов.
2) String — текст
3) HTMLElement — вложенный тег
4) Array — список из текстов и тегов.

Два примера

Пример 1

Имеем

var items = ["x", "y"];


Хотим получить

<div>
  <div id="some" class="some-class">
    some div
  </div>
  some text
  <div>x</div>
  <div>y</div>
</div>


result содержит то что мы хотим.

var result;
with (Htmls) {
  result = div(
    div({ id: "some", class: "some-class" },
      "some div"),
    "some text",
    items.map(function (i) {
      return div(i);
    }))
  .outerHTML;
}

* This source code was highlighted with Source Code Highlighter.

Пример 2 из вышеупомянутого топика

data = {
  title: 'C pocket reference',
  type: 'PDF Document',
  tag: 'programming',
  created_at: '5.31.2010'
}
with (Htmls) {
  var tagUrl =   "tags/" + data.tag;
  var result = tr(
    td(data.title),
    td(data.type),
    td(a({href: tagUrl}, data.tag)),
    td(data.created_at))
    .outerHTML;
}

* This source code was highlighted with Source Code Highlighter.

Незамысловатый код

Htmls = (function () {
  function initTag(tag, args) {
    for (var i = 0; i < args.length; i++) {
      var arg = args[i];
      if (arg.constructor == String) {
        tag.innerHTML += arg;
      }
      else if (arg instanceof HTMLElement) {
        tag.appendChild(arg);
      }
      else if (arg.constructor == Array) {
        initTag(tag, arg);
      }
      else if (arg.constructor == Object) {
        for (var j in arg) {
          tag.setAttribute(j, arg[j]);
        }
      }
    }
    return tag;
  }

  function createTag(name, args) {
    return initTag(document.createElement(name), args);
  }

  return {
    div: function () {
      return createTag("div", arguments);
    }
  //можно добавлять другие теги
  }
})();


* This source code was highlighted with Source Code Highlighter.