14、使用jQuery Mobile处理列表

使用jQuery Mobile处理列表

1. 列表的基本概念

列表是HTML中最古老的元素之一，早在1990年代初的网页中就已经存在。一个简单的HTML列表示例如下：

<ul>
    <li><a href="#nav1">Henry VIII</a></li>
    <li><a href="#nav1">George V</a></li>
    <li><a href="#nav1">Prince of Wales</a></li>
    <li><a href="#nav1">Elizabeth I</a></li>
    <li><a href="#nav1">Elizabeth II</a></li>
</ul>

在移动设备上，使用 <ul> 和 <li> 标签创建的列表非常实用，可以很好地展示信息。然而，普通的HTML列表在移动设备上显得较为单调，缺乏交互性和视觉吸引力。为了提升用户体验，我们可以使用jQuery Mobile来增强这些列表。

2. 将普通列表转换为增强列表

通过添加 data-role="listview" 属性，可以将普通的HTML列表转换为类似原生