J Query Metadata

Homepage: https://github.com/MichaelDaum/jquery-metadata
Author(s): John Resig, Yehuda Katz, Joern Zaefferer, Paul McLanahan
Version: 2.1ef2bb44c86f5d0e98d55

This plugin is capable of extracting metadata from classes, random attributes, and child elements.

Usage

A lot of jQuery plugins are initialized and configured using metadata embeded into the markup thus eliminating the need to explicitly write JavaScript. A behavior is assigned to an html element by giving it the pertinent class name that the plugin listens to. Parameters to the plugin itself are embeded as a JSON object inside the class attribute. J Query Metadata can also be encoded differently. Having it inside the class attribute as well is most common. One exception is J Query Corner for example, that uses an explicit data-corner attribute, which of course isn't standard conform markup. However browsers happily ignore attributes that they don't understand. So that's not a problem in real live.

Examples

Load the plugin as required for the current page:

%JQREQUIRE{"mynewplugin"}%

This is how the markup looks like:

<div class="jqMyNewPlugin {key1:'value1', key2:'value2', key3:'value3'}">

<div>

This is the plugin's initializer reading the metadata:

jQuery(function($) {

  var defaults = {
    key1: 'default1',
    key2: 'default2',
    key3: 'default3'
  };

  // find all elements tagged .jqMyNewPlugin that aren't init'ed yet
  // ... using livequery instead of each to trigger initialisation of async content

  $(".jqMyNewPlugin:not(jqInitedMyNewPlugin)").livequery(function() {

     // create a jQuery object for this
     var $this = $(this);

     // prevent the markup to be init'ed multiple times
     $this.addClass("jqInitedMyNewPlugin");
   
     // get plugin options by merging defaults and current json objs
     var opts = $.extend({}, defaults, $this.metadata());

     // call the plugin handler
     $this.myNewPlugin(opts);
  });
});