jQuery Mobile 列表学习笔记
jQuery Mobile 提供了列表组件来展示数据，包括无序列表，有序列表和描述列表。列表组件旨在提供易于定制和高度可访问的列表。
无序列表
无序列表是一系列项目列表，每个项目由一个符号或图标表示。要创建无序列表，请使用<ul>标签。
htmlCopy Code<ul>
<li>项目1</li>
<li>项目2</li>
<li>项目3</li>
</ul>
有序列表
有序列表是一系列按顺序排列的项目列表。它们通常用数字或字母标记，但可以通过 CSS 定义任何自定义计数器。要创建有序列表，请使用<ol>标签。
htmlCopy Code<ol>
<li>第一项</li>
<li>第二项</li>
<li>第三项</li>
</ol>
描述列表
描述列表是一系列名词和它们对应的描述。每个名称和描述都用<dt>和<dd>标签组成。要创建描述列表，请使用<dl>标签。
htmlCopy Code<dl>
<dt>名称1</dt>
<dd>描述1</dd>
<dt>名称2</dt>
<dd>描述2</dd>
<dt>名称3</dt>
<dd>描述3</dd>
</dl>
示例
下面是一个使用 jQuery Mobile 列表组件的示例。
htmlCopy Code<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>jQuery Mobile 列表示例</title>
<link rel="stylesheet" href="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css">
<script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
</head>
<body>
<div data-role="page">
<div data-role="header">
<h1>列表示例</h1>
</div>
<div data-role="content">
<h2>无序列表</h2>
<ul>
<li>项目1</li>
<li>项目2</li>
<li>项目3</li>
</ul>
<h2>有序列表</h2>
<ol>
<li>第一项</li>
<li>第二项</li>
<li>第三项</li>
</ol>
<h2>描述列表</h2>
<dl>
<dt>名称1</dt>
<dd>描述1</dd>
<dt>名称2</dt>
<dd>描述2</dd>
<dt>名称3</dt>
<dd>描述3</dd>
</dl>
</div>
</div>
</body>
</html>
此示例将显示一个页面，其中包含了三种类型的列表：无序列表，有序列表和描述列表。