jQuery Microdata

Extract and manipulate objects stored in HTML Microdata.

Get all items of a certain type

$(node).items(itemtype)

$('#albumlist').items('http://schema.org/MusicAlbum')

Get the property nodes of an item

item.property(property) => a set of jQuery nodes

$(node).property('name') => [ node ]

$(node).property('byArtist').eq(0).property('album') => [ node, node ]

Get the value of a property

property.value() => the itemValue of the node(s)

$(node).property('name').value() => string

$(node).property('byArtist').eq(0).property('name').value() => string

Get the values of a property as an array

property.values() => array of the itemValues of the nodes

$(node).property('name').values() => [ string, string ]

Set a property

item.property(property).value(value)

$(node).property('name').value('Yellow Submarine')

Set one of multiple properties with the same name

item.property(property).eq(index).value(value)

$(node).property('name').eq(1).value('Yellow Submarine')

jQuery Things

The plugin also provides a convenience method for working with items ("things") where there is only a single instance of each property. This is analogous to jQuery's data method.

Get a property of an item

item.microdata(key)

$(node).microdata('name');

Set a property of an item

item.microdata(key, value)

$(node).microdata('name', 'The Beatles');

Set multiple properties of an item

item.microdata({ key: value })

$(node).microdata({
    name: 'The Beatles',
    url: 'https://en.wikipedia.org/wiki/The_Beatles'
});

Get all properties of a single item or a collection of matched items

collection.microdata()

$(node).microdata()

$('#albumlist').items('http://schema.org/MusicAlbum').microdata()

Nested schemas

Selecting the outermost schema does not also return nested schemas.

Example

JavaScript:

$(function() {
    var jobs = $('#job-data').items('http://schema.org/JobPosting');
    var code = $('<code/>', {
        text: JSON.stringify(jobs.microdata(false), null, 2)
    });
    $('#microdata-expanded').append(code);
});

HTML:

<table id="job-data">
    ...
   <tr itemscope itemtype="http://schema.org/JobPosting">
       <th itemprop="reference">ABC123</th>
       <td itemprop="title">Job Title</td>
       <td itemprop="occupationalCategory">Job Category</td>
       <td>
           <table itemscope itemtype="http://schema.org/PostalAddress">
               <tbody>
                   <tr><td itemprop="postOfficeBoxNumber"></td></tr>
                   <tr><td itemprop="streetAddress">1 Some Road</td></tr>
                   <tr><td itemprop="addressLocality">Town/City</td></tr>
                   <tr><td itemprop="addressRegion">Region/County</td></tr>
                   <tr><td itemprop="postalCode">ABC 123</td></tr>
                   <tr><td itemprop="addressCountry">UK</td></tr>
               </tbody>
           </table>
       ...

Result:

Data from http://schema.org/JobPosting is returned, but data from http://schema.org/PostalAddress is not returned.

Update

My apologies. The td element wrapping the PostalAddress required the following itemprop:

<td itemprop="jobLocation">

PostalAddress items are now being returned.

However, the nested tables are returned as the following:

"jobLocation": "1 Some Road\n                        Town/City\n                        Region/County\n                        ABC 123\n                        UK",

Why are white space and carriage returns being included?

Thanks for the plug-in. Any idea how the browser vendors plan to deal with Microdata if they're dropping the API?

hubgit / jquery-microdata Goto Github PK