As we saw in the previous example, just adding in jQuery Mobile goes a long way to updating our page for mobile support. But there's a lot more involved to really prepare our pages for mobile devices. As we work with jQuery Mobile over the course of the book, we're going to use various data attributes to mark up our pages in a way that jQuery Mobile understands. But what are data attributes?
HTML5 introduced the concept of data attributes as a way to add ad-hoc values to the DOM (Document Object Model). As an example, this is a perfectly valid HTML:
<div id="mainDiv" data-ray="moo">Some content</div>
In the previous HTML, the
data-ray attribute is completely made-up. However, because our attribute begins with
data-, it ...