jQuery mobile：数据角色和角色/类之间的差异 [英] jQuery mobile: difference between data-role and role/class

问题描述

我对jQuery和网页设计真的很新，请原谅我问这个天真的问题。

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

在最新的jQuery移动网站，他们有例子：

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

和 ，他们有：

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

我的问题是：
1）这只是一个版本问题，对于新版本？

My questions are: 1) Is this just a version issue, that the 1st case is preferred to the 2nd case, for the new version?

我个人觉得有点不舒服，因为我有 data-role =page 或header或footer中间一个。

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

2）我试图在他们的API文档找到这个部分，但是找不到它 - role =main和 class =ui-content？我认为数据角色只是为jQuery在pagecreate应用类，在这种情况下， role =main做同样的事情吗？如果是，为什么他们使用两个？

2) I tried to find this part on their API doc, but can't find it - what is the separate role of role="main", and class="ui-content"? I thought the data-role is just for jQuery to apply classes at pagecreate, and in this case, is role="main" doing the same thing? If it is, why are they using both?

我知道第二个问题是一个非常大的问题，只要有人能指向我的文档链接

I know the 2nd question is a very big one, and as long as someone can point me to a documentation link that can explain this I'd really appreciate it.

谢谢！

推荐答案

p> data-role =content已在jQuery Mobile第一版中使用，直到1.3.2。在新的稳定版本中，除了其他< div role =mainclass =ui-content> >

data-role="content" has been used in jQuery Mobile first version until 1.3.2. In the new stable version it has been changed into <div role="main" class="ui-content">, in addition to other data-role's that have been removed and replaced with classes instead.

jQuery Mobile已经决定不再使用某些 data-role 是加快初始化并减少增强 DOM元素的时间。此外，已弃用的 data-role 的不是 widgets ，因此它们在jQM API中没有任何特殊功能。

The reason jQuery Mobile has decided to deprecated some data-role's, is to speed up initialization and reduce time in enhancing DOM elements. Moreover, the deprecated data-role's are not widgets, so they don't have any special functions in jQM API.

效果（参考）

为了提高性能，我们减少了DOM操作。被称为butons的元素的内部标记的生成已被完全移除。在许多情况下，框架只是在增强期间向原生元素添加类，我们甚至减少了框架添加的类的数量。

To improve performance we reduced DOM manipulation. Generation of inner markup for elements styled as butons has been completely removed. In many cases the framework just adds classes to the native element during enhancement and we even reduced the amount of classes that are added by the framework.

某些已弃用的 data-role '（参考）

• 已弃用 $ .fn.mobile.fieldcontain（）和 data-role =field-contain。只需添加类ui-field-contains

• Deprecated $.fn.mobile.fieldcontain() and data-role="field-contain". Just add class "ui-field-contain".

已弃用 -role =content和选项contentTheme（ data-theme ）。这也意味着框架不再添加ARIA角色main。在您的标记中添加类 ui-content 和 role =main。

Deprecated data-role="content" and option contentTheme (data-theme). This also means that the framework no longer adds ARIA role "main". Add class ui-content and role="main" in your markup instead.

此外， .buttonMarkup（）以及 data-role =button已弃用，将于1.5版中移除。

Also, .buttonMarkup() as well as data-role="button" are deprecated and will be removed in 1.5.

这篇关于jQuery mobile：数据角色和角色/类之间的差异的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！