jQuery UI简介
jQuery UI包含了许多维持状态的小部件（Widget），因此，它与典型的 jQuery 插件使用模式略有不同。所有的 jQuery UI 小部件（Widget）使用相同的模式，所以，只要您学会使用其中一个，您就知道如何使用其他的小部件（Widget）。
jQuery UI组件构成
jQuery UI 主要分为3个部分：交互、微件和效果库。
交互（Interactions）
交互部件是一些与鼠标交互相关的内容，包括缩放（Resizable） , 拖动（Draggable） , 放置（Droppable） , 选择（Selectable） , 排序（Sortable）等。
小部件（Widgets）
主要是一些界面的扩展，包括折叠面板（Accordion） , 自动完成（Autocomplete） , 按钮（Button） , 日期选择器（Datepicker） , 对话框（Dialog） , 菜单（Menu） , 进度条（Progressbar） , 滑块（Slider） , 旋转器（Spinner） , 标签页（Tabs） , 工具提示框（Tooltip）等，新版本的UI将包含更多的微件。
效果库（Effects）
用于提供丰富的动画效果，让动画不再局限于jQuery的animate()方法。包括特效（Effect） , 显示（Show） , 隐藏（Hide） , 切换（Toggle） , 添加 Class（Add Class） , 移除 Class（Remove Class） , 切换 Class（Toggle Class） , 转换 Class（Switch Class） , 颜色动画（Color Animation）等。
引用jQuery UI
在页面head部分添加如下语句就可以引用字节跳动的静态资源库，当然也可以使用其他的库或者直接下载到本地，一方面字节的库比较全，另一方面，学习调试的时候，直接两行代码搞定运行依赖也相对方便。
<script src="https://lf3-cdn-tos.bytecdntp.com/cdn/expire-1-M/jqueryui/1.12.1/jquery-ui.min.js" type="application/javascript"></script>
<link href="https://lf26-cdn-tos.bytecdntp.com/cdn/expire-1-M/jqueryui/1.12.1/jquery-ui.min.css" type="text/css" rel="stylesheet" />