Webの進化形としてセマンティックWebが知られています。タグを使って文書をより構造的に、情報処理しやすい形に書いていくという考え方です。しかし、そのためにタグを多数覚えるのは面倒かも知れません。 今回紹介するDiv.jsで描くHTMLにおいては覚えるタグがdivしかありません。それなのに十分な表現が可能です。

Div.jsの使い方

実際の内容です。ものすごい出落ち感があります。

<div is="h1">Hello world!</div>
<div is="p">This is a <div is="b">bold</div> paragraph.</div>
<div is="ol">
  <div is="li">This is a list item.</div>
  <div is="li">This is a list item.</div>
  <div is="li">This is a list item.</div>
</div>

Div.jsは確かにdivタグしか使いません。そしてis要素で書かれたタグにJavaScriptで置き換えます。もちろんこれはジョークライブラリになるでしょうし、セマンティックWebに喧嘩を売っているとも言えそうです。HTMLコーディングもなかなか大変そうです（普通のHTMLを書いてから正規表現で置き換えるという二度手間をしそうですね）。

Div.jsはJavaScript製のオープンソース・ソフトウェア（MIT License）です。

GitHub - willmartindev/div.js: A framework for the HTML programming language.