Skip to content

jQuery plugin for building declarative HTML tags with imperative code

License

Notifications You must be signed in to change notification settings

mateusmaso/jquery.html

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

16 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

jquery.html Build Status

This library is an extension for jQuery which allows writing HTML using Javascript or Coffeescript, reducing the visual pollution while creating elements dynamically.

Features

  • Build node trees using tag as methods.
  • Attributes and string content support.

Dependencies

  • jquery.js (>= 2.1.0)

Examples

Javascript DSL

$('body').$div(function() {
  this.$h1({id: "hello-world"}, "Hello World");
  this.$ul({class: "list"}, function() {
    this.$li("One");
    this.$li("Two");
    this.$li("Three");
  });
});

Coffeescript DSL

$('body').$div ->
  @$h1 id: "hello-world", "Hello World"
  @$ul class: "list", ->
    @$li "One"
    @$li "Two"
    @$li "Three"

Expected result

<body>
  <div>
    <h1 id="hello-word">Hello World</h1>
    <ul class="list">
      <li>One</li>
      <li>Two</li>
      <li>Three</li>
    </ul>
  </div>
</body>

License

Copyright (c) 2013-2014 Mateus Maso. Released under an MIT license.