This may be a naive question, but I'm learning jQuery Mobile and unsure why everything is related to a data-role
attribute. It seems that even times when the role is related to the style, they are using data-role
over class
I understand that for semantics, data-role
makes sense in a lot of cases but it just seems to be abused here. Wouldn't that kind of lookup also be slower?
Why do they use data-role
over class?
Thanks for any insight.
A page in jQuery Mobile consists of an element with a data-role="page" attribute. Within the "page" container, any valid HTML markup can be used, but for typical pages in jQuery Mobile, the immediate children of a "page" are divs with data-role="header" , class="ui-content" , and data-role="footer" .
The team announced that the cross-platform jQuery Mobile project under its umbrella will be fully deprecated as of October 7, 2021. New technologies for mobile app development have evolved since this project was launched in 2010, so we're encouraging developers to plan for this jQuery Mobile transition.
jQuery is a DOM manipulating/traversing and AJAX JavaScript framework. It abstracts out a lot of the complexity between the different browsers automatically. There are countless jQuery plugins that simplify many task. jQuery Mobile is a UI framework geared to mobile applications that is built on jQuery.
Definition and Usage The data-* attribute is used to store custom data private to the page or application. The data-* attribute gives us the ability to embed custom data attributes on all HTML elements.
data
They could simply use role
as an attribute (like other frameworks do), but this would make
the resulting HTML invalid. Therefore a data-
is added to every attribute name.
I think the main reason for that is to separate view from logic as far as it is possible. In larger projects, CSS and JavaScript are not written by the same person.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With