JQuery mobile: difference between data role and role / class

Question

I'm really new to jQuery and web design, and please excuse me for asking this naive question.

On the latest jQuery website , they have an example:

<div role="main" class="ui-content">
    <p>Page content goes here.</p>
</div><!-- /content -->

And for some older ones , they have:

 <div data-role="content">
     <p>Page content goes here.</p>
 </div>

My questions: 1) Is it just a version problem, what is the first case preferable to the second option for the new version?

I personally feel a little uncomfortable because I have data-role="page", or "header", or "footer", but is inconsistent for the average.

2) API, - role="main" class="ui-content"? , jQuery pagecreate, role="main" ? , ?

, , - , , .

!

Answer 1

data-role="content" jQuery Mobile 1.3.2. <div role="main" class="ui-content">, data-role, .

, jQuery Mobile data-role, DOM. , data-role , jQM API.

()

, DOM. , , . , , .

data-role 's: ()

• $.fn.mobile.fieldcontain() data-role="field-contain". "ui-field-contain".

• data-role="content" contentTheme (data-theme). , ARIA "main". ui-content role="main" .

, .buttonMarkup(), data-role="button" 1.5.