07-压缩文件

选择背景色：黄橙洋红淡粉水蓝草绿白色选择字体：宋体黑体微软雅黑楷体选择字体大小：小中大特恢复默认

Previous 上一篇本节目录 Next 下一篇

1.4.2　压缩文件

使用压缩文件能减少HTML页面的加载时间。

1．JavaScript文件

js目录（位于jQuery UI安装目录下面，这里是jqueryui）包含了JavaScript文件。这里只需要jquery-ui-1.8.16.custom.min.js文件。目录中的另外一个文件是压缩版本的jQuery。

2．CSS文件

css目录（位于jQuery UI安装目录下面，这里是jqueryui）包含了每个已安装主题的子目录（例如，smoothness和ui-lightness目录）。

每个主题都包括了一个images目录和一个会被引入到HTML页面中的CSS文件。这和最终的custom.css（比如，jquery.ui-1.8.16.custom.css）是一样的，是个压缩版本。

3．引入压缩文件的HTML示例页面

我们想显示一个有两个选项卡的页面（和之前的一样）：

<script src = jquery.js></script>
<script src = jqueryui/js/jquery-ui-1.8.16.custom.min.js></script>
<link rel=stylesheet type=text/css
　　　 href=jqueryui/css/smoothness/jquery-ui-1.8.16.custom.css />

除了jquery.js文件外，现在只需要两个文件了：

jQuery UI 的JavaScript全局文件（jquery-ui-1.8.16.custom.min.js）；
与使用的样式相关的整个jQuery UI CSS文件（smoothness/jquery-ui-1.8.16.custom.css，与smoothness主题相关的文件）。

现在再添加与之前一样的HTML代码来创建、标记和填充选项卡：

<div id=tabs>
　 <ul>
　　　<li><a href=#tab1>Tab 1</a></li>
　　　<li><a href=#tab2>Tab 2</a></li>
　 </ul>
　 <div id=tab1>Contents of first tab</div>
　 <div id=tab2>Contents of the second tab</div>
</div>
<script>
$("#tabs").tabs ();
</script>

结果和之前的是一样的。