Categories

.metaparse()

Categories: Utilities

.metaparse( [ options ] )Returns: jQuery

Plugin: jQuery.metaparse

Description: Run jQuery methods instantly without script tags.

  • .metaparse( [ options ] )

    version added: 1.0

    options   A set of key/value pairs that configure the .metaparse() call. A default are set for any option by jQuery.metaparseSettings.

The .metaparse() method is capable of runnig meta code extracted from classes, random attributes, child elements and HTML5 data-* attributes.

The syntax: write jQuery methods without selector and use single quotes, the extracted code will be applied to the element which containted the code.

A standart meta code

".fadeTo()"

Meta code using a plugin

It's posible to load dependencies like the jQuery.ready() call in a metaparse statement. Just set .ready(dependencies) in front of the statement.

".ready({plugin:'jQuery.fn.size'}).outerWidth(500)"

Meta code using a jQuery sub class

If you want to run code from jQuery sub classes write the name of the sub class object before the first dot. Be sure the sub class was defined on the global window object like this window.$sub = $.sub().

"$sub.fadeTo().subMethod()"

Meta code using plugins and a jQuery sub class

You also can combine dependencies and jQuery sub classes in a metaparse statement.

"$sub.ready({plugin:['$sub.core','jQuery.fn.size']}).outerWidth(500).subMethod()"
  • Run meta code extracted from a class.

    HTML:
    <ul>
      <li class="metaparse .addClass('li-1')"></li>
      <li class="metaparse .addClass('li-2')"></li>
      <li class="metaparse .addClass('li-3')"></li>
      <li class="metaparse .hide()"></li>
      <li class="metaparse .fadeTo(0.5)"></li>
    </ul>
    Code:
    $('*.metaparse')
        .metaparse({
        	type: 'class'
        });
    Results:
    <ul>
      <li class="metaparse li-1"></li>
      <li class="metaparse li-2"></li>
      <li class="metaparse li-3"></li>
      <li class="metaparse " style="display:none;"></li>
      <li class="metaparse " style="opacity:0.5;"></li>
    </ul>
  • Run meta code extracted from html5 metaparse.

    HTML:
    <ul>
      <li metaparse=".addClass('li-1')"></li>
      <li metaparse=".addClass('li-2')"></li>
      <li metaparse=".addClass('li-3')"></li>
      <li metaparse=".hide()"></li>
      <li metaparse=".fadeTo(0.5)"></li>
    </ul>
    Code:
    $('*[metaparse]')
        .metaparse({
        	type: 'attr',
        	name: 'metaparse'
        });
    Results:
    <ul>
      <li class="li-1" metaparse=""></li>
      <li class="li-2" metaparse=""></li>
      <li class="li-3" metaparse=""></li>
      <li metaparse=""style="display:none;"></li>
      <li metaparse="" style="opacity:0.5;"></li>
    </ul>
  • Run meta code extracted from data (html5) attribute metaparse.

    HTML:
    <ul>
      <li data-metaparse=".addClass('li-1')"></li>
      <li data-metaparse=".addClass('li-2')"></li>
      <li data-metaparse=".addClass('li-3')"></li>
      <li data-metaparse=".hide()"></li>
      <li data-metaparse=".fadeTo(0.5)"></li>
    </ul>
    Code:
    $('*[data-metaparse]')
        .metaparse({
        	type: 'data',
        	name: 'metaparse'
        });
    
    // or
    
    $('*[data-metaparse]')
        .metaparse({
        	type: 'html5',
        	name: 'metaparse'
        });
    Results:
    <ul>
      <li class="li-1" data-metaparse=""></li>
      <li class="li-2" data-metaparse=""></li>
      <li class="li-3" data-metaparse=""></li>
      <li data-metaparse="" style="display:none;"></li>
      <li data-metaparse="" style="opacity:0.5;"></li>
    </ul>
  • Run meta code extracted from an element.

    HTML:
    <ul>
      <li class="metaparse"><var>.addClass('li-1')</var></li>
      <li class="metaparse"><var>.addClass('li-2')</var></li>
      <li class="metaparse"><var>.addClass('li-3')</var></li>
      <li class="metaparse"><var>.hide()</var></li>
      <li class="metaparse"><var>.fadeTo(0.5)</var></li>
    </ul>
    Code:
    $('*.metaparse')
        .metaparse({
        	type: 'elem',
        	name: 'var'
        });
    Results:
    <ul>
      <li class="metaparse li-1"></li>
      <li class="metaparse li-2"></li>
      <li class="metaparse li-3"></li>
      <li class="metaparse " style="display:none;"></li>
      <li class="metaparse " style="opacity:0.5;"></li>
    </ul>
  • type

    version added: 1.0

    An extraction type 'class', 'elem', 'attr', 'data' or 'html5'.

    Default: 'class'

  • name

    version added: 1.0

    The name of the attribute, html5 data-* attribute or element to extract the code.

    Default: 'metaparse'

  • metaparse

    version added: 1.2

    This event is triggered when metaparse is done.