Navigation
HomeSearch
Submit A Resource
Contact Us
About Functionn
Subscription Options
Subscribe By Email (265+)
Lists
Archives
Apr 26, 2012
Laconic - Laconic Is A Lightweight Approach To Generating DOM Content In JavaScript
Laconic is a lightweight approach to generating DOM content in JavaScript. The source code is available on GitHub. Consider the code necessary to produce a simple table hierarchy with the standard DOM API:
This code is beyond verbose, which makes determining the resulting hierarchy difficult. Let's take a look at the laconic way to generate the same table:
Laconic adds a method to the $.el namespace for all known HTML tags. These methods should be invoked with a variable length list of child elements or strings. An optional attributes object may be passed as the first argument. For example:
will produce the following structure:
You can even register your own custom 'tags' that define a particular hierarchy of known elements. You just need to provide a name for your tag, and a function that appends content to 'this', which is a reference to the root node of the tag. For example:
Once you've registered a tag, you can start inserting it:
This particular invocation will produce the following structure:
Requirements: None
Demo: http://joestelmach.github.com/laconic/
License: MIT License
This code is beyond verbose, which makes determining the resulting hierarchy difficult. Let's take a look at the laconic way to generate the same table:
Laconic adds a method to the $.el namespace for all known HTML tags. These methods should be invoked with a variable length list of child elements or strings. An optional attributes object may be passed as the first argument. For example:
will produce the following structure:
You can even register your own custom 'tags' that define a particular hierarchy of known elements. You just need to provide a name for your tag, and a function that appends content to 'this', which is a reference to the root node of the tag. For example:
Once you've registered a tag, you can start inserting it:
This particular invocation will produce the following structure:
Requirements: None
Demo: http://joestelmach.github.com/laconic/
License: MIT License
Trending Posts On Functionn This Week
Other Interesting Resources:
Subscribe to:
Post Comments (Atom)
Trending Posts
Popular Posts
- 20 Fresh, High-Quality Free WordPress Themes 2012
- 50 Fresh, High-Quality Free WordPress Themes 2012 - Edition #2
- The Most Comprehensive Index Of Free Icon Fonts/Iconic Web Fonts
- Timeline - A JavaScript Library For Beautifully Crafted Timelines That Are Easy, And Intuitive To Use
- BLUR.JS - A JQUERY PLUGIN PRODUCING PSUEDO-TRANSPARENT BLURRED ELEMENTS
- Selene - A Stunning & Sleek jQuery UI Theme
- jQuery UI Bootstrap Theme - Bootstrap v2.X's Theme For jQuery UI
Recent Posts
Popular Categories
- JavaScript (535)
- JQuery (275)
- Libraries (132)
- CSS (115)
- frameworks (113)
- Tools (112)
- html (86)
- Github (79)
- html5 (71)
- Node.js (58)
- mobile (52)
- Responsive (49)
- CSS3 (47)
- page effects (45)
- Web Design (41)
- Bootstrap (35)
- twitter (31)
- image effets (22)
- MVC (18)
- generators (18)
- CoffeeScript (16)
- graphics (10)
Popular Components
- icons (42)
- Graphs (22)
- popups (19)
- notifications (17)
- web fonts (17)
- visualizations (14)
- sliders (11)
- polyfills (10)
- localstorage (8)
- social media buttons (8)
Popular Licenses
- MIT License (493)
- free (144)
- GPL (64)
- Apache License v2.0 (48)
- CC Attribution 3.0 License (46)
- GPLv2 (20)
- GPLv3 (11)
- Custom License (7)
0 comments:
Post a Comment