HTML5 's microdata micro-data

Source: Internet
Author: User

-Why micro-data is needed
Long and tired version of slips, not good understanding
Micro-tagging to label the content, making it easy to identifying

-RDFa
Resource Description Framework
Http://www.w3.org/TR/microdata
Http://www.whatwg.org/specs/web-apps/current-work/multipage/links.html#microdata
Http://www.w3.org/TR/rdfa-in-html

---itemscope tags

< Articleitemscope >    <  itempropsteps ontothe stage ...    <span itemproponthe drums ...    <span itemproponthe bass    ... <span itemproppiano ... </article>

This will highlight the contents of the paragraph

---how the search engine resolves

http://foolip.org/microdatajs/live/Online Analysis

Server:

{    "items":[{    "properties":{    "musician": ["Pat Metheny",    " Antonio Sanchez ",    " Steve rodby ",    " Lyle Mays "  }}  ]}

All prop are parsed.

---itemprop support elements

property element
-------------------------------------------------
Srcaudio,embed,iframe,img,source,video
Hrefa,area,link
Datetimetime
Contentmeta
DataObject

---Itemtype tags

Specifying data formats

<articleItemscope itemtype=http://microformats.org/profile/hcalendar#vevent><time Itemprop=dtstartdatetime= "2010-10-09t20:30:00-04:00">Saturday, October 9th, just before half past eight in the evening</ Time>  <spanItemprop=location>communityTheater</span>inch<spanItemprop=location>morristown,Nj</span>...  <spanItemprop=summary>oRchestrion</span> ... </article>

---parsing

Specifies that data is parsed using the calendar format

Begin:vcalendar
Prodid:jquery Microdata
version:2.0
Begin:vevent
Dtstamp; Value=date‐
time:20101227t205755z
Dtstart; Value=date‐
time:20101009t2030000400
Location:community Theater
Location:morristown\, NJ
Summary:orchestrion
End:vevent
End:vcalendar

---nested use

<articleItemscope itemtype=http://microformats.org/wiki/hreview><div Itemprop=itemItemscope itemtype=http://microformats.org/profile/hcalendar#vevent><span Itemprop=summary>oRchestrion</span>,    < TimeItemprop=dtstartdatetime= "2010-10-09t20:30:00-04:00">October 9th</ Time>:  </Div>  <spanItemprop= "Summary">A Fascinating evening</span>rated with<spanItemprop= "rating">5</span>stars out of 5 stars. <DivItemprop=reviewerItemscope itemtype=http://microformats.org/profile/hcard><span Itemprop=fn>nicosThassofilakas</span>,   <ahref=http://openweb.ccItemprop=url>openweb.cc</a></div></article>

---ItemId properties

Used to specify a unique ordinal number

<DivItemscope itemtype=http://vocab.example.net/bookItemid= "urn:isbn:978‐0634066634">  <spanItemprop=album>oneQuiet Night</span> by<spanItemprop=artist>patMetheny</span>  (< TimeItemprop=pubdatedatetime=2005‐04‐01>2005</time>,<span Itemprop=pages>88</span>pages) </div>

---itemref properties

Refer to another microdata by using HTML tags or itemid

<article>    <DivID=location><span Itemprop=member>patMetheny</span>    </Div>    <DivID=intro><span Itemprop=member>antonioSanchez</span>    <spanItemprop=member>steveRodby</span>    <spanItemprop=member>lyleMays</span>    <spanItemprop=band>patMetheny Group</span>    </Div>  </article>  <Divitemscope itemref= "Location Intro"></Div>

---parsing available dictionaries

http://micoformats.org

-Microdata DOM API

JS Full support

  var allnodes = document.getitems ();   var vcards = Document.getitems (' Http://microfomats.org/profile/hcard ');  

Property content
------------------------------------------
Itemscopevalue of Itemscope attribute
Itemtypevalue of itemtype attribute, if present
Itemidvalue of Itemid attribute, if present
Itemrefvalue of Itemref attribute, if present

-Attribute methods at a glance

Property/method Content
------------------------------------
The length of the element object in the collection
Item (Index) Access element content
Nameditem (name) uses the Name property in Itemprop to access the object
Nameditem (name). Values Access Itemprop The value of the property in the specified name
Namesdomstringlist property values for all Itemprop
Names.lengthitemprop worth the length
Names.item (Index) object value using the Itemprop property value
Names.contains (name) to determine if the Itemprop attribute is included

---small instances

 < SectionItemscope itemtype= "http://www.data-vocabulary.org/Person/">    <H1Itemprop= "Name">Tom</H1>    <P><imgsrc= "1.jpg"alt= "Zhang San photos"Itemprop= "Photo"></P>    <P><ahref= "www.zhangsan.org"Itemprop= "url">Brother Zhang San</a></P>        <DDItemprop= "Address"Itemscope itemtype= "http://www.data-vocabulary.org/Person/">    <spanItmeprop= "Region">Dongcheng district</span>    </DD>  </ Section>

HTML5 's microdata micro-data

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.