
High performance
More native and highly optimized function to speed up the experience

Easy-to-learn
Familiar what you used and learnt before with flexible and friendly code

Light and powerful
6KB gzipped file size with 60+ useful functions, everything you wanted

Compatibility: IE6+, Chrome4+, Firefox2+, Safari3+, Opera9+
DOM & Animation
$tag($('wrap'), 'div', function (item) { $html(item, 'some value'); }); $hide($('element_id')); $hide($('element_id_1 element_id_2 element_id_3'), 500); $animate($("element"), { "width": { from: 200, to: 30 } }, 500, function () { // Do something });
AJAX
$ajax("example.php", { data: { "foo": "bar" }, success: function (data) { // Do something } } });
Template
var template = "<div><h1>{{header}}</h1><h2>{{header2}}</h2><ul>{{#list}}<li>{{this}}</li>{{/list}}</ul><ul>{{#people}}<li>{{name}} - {{city}}</li>{{/people}}</ul></div>"; var data = { header: "Header", header2: "Header2", header3: "Header3", list: ["1", "2", "3"], people: [ {"name": "Tom", "city": "California"}, {"name": "Jack", "city": "Newton"}, {"name": "Jone", "city": "Tokyo"} ] }; $append($("container"), $template(template, data)); // Output (formatted) // <div> // <h1>Header</h1> // <h2>Header2</h2> // <ul> // <li>1</li> // <li>2</li> // <li>3</li> // </ul> // <ul> // <li>Tom - California</li> // <li>Jack - Newton</li> // <li>Jone - Tokyo</li> // </ul> // </div>
Require
$require([ "http://abc.com/foo.js", "http://abc.com/foo.css" ], function () { // Do something });
Cookie & storage
$cookie.set("foo", "bar"); $storage.set("foo", "bar");