什么是jQuery Mobile 1.4中使用的role ="main"?

Phi*_*enn 8 jquery-mobile

jQuery Mobile 1.4已经改变

<div data-role="content">...</div>
Run Code Online (Sandbox Code Playgroud)

<div role="main" class="ui-content">...</div>
Run Code Online (Sandbox Code Playgroud)

我理解现在使用类而不是数据角色的目的,但我不明白的是这个角色="主".它是干什么用的?

khe*_*eld 10

role属性是HTML5的原生属性,旨在支持WAI-ARIA.
http://www.w3.org/TR/html5/dom.html#wai-ariahttp://www.w3.org/TR/wai-aria/roles#role_definitions

早期版本中的jQuery Mobile只是将属性为data-role ="content"的元素转换为main元素<div role="main">(相当于<main>)并添加了CSS.所以你得到了<div role="main" class="ui-content">.

对于data-role ="content"的元素,没有其他处理或添加的标记.通过弃用data-role ="content"属性并使用直接使用正确的HTML5(CSS和WAI-ARIA角色),jQuery Mobile将不得不为每个页面执行更少的处理.

  • `role ="main"`将受到更多浏览器的支持.如果你使用main,规范说你还需要角色属性`<main role ="main">`.使用`<main>`可能会导致jQuery Mobile的单页面应用程序(SPA)模型出现问题.使用SPA模型,您可以在导航到不同页面时在DOM中加载多个`<main>`元素.规范不允许这样做.因此,当`<div role ="main">`等同于`<main>`时,有充分的理由使用div而不是当前的主标记. (3认同)