本案例能够根据需求允许用户对开销进行分类，并根据分类显示记录。在浏览开销过程中，能够以简洁、醒目和方便的视图效果方便用户浏览和操作，网站首页效果如图1所示。
图1 网站首页效果
整个示例以HTML+CSS+JavaScript+jQuery+Access技术混合进行开发，遵循结构、表现、逻辑和数据完全分离的原则进行设计。
- 结构层由HTML负责，在结构内不包含其他层代码。
- 表现层完全独立，并实现表现动态样式控制。
- CSS代码兼容IE 6、IE 7、IE 8和FF等主流浏览器，符合Web标准设计的规范。
- 逻辑层使用JavaScript+jQuery技术配合进行开发，充分发挥各自优势，以实现最优化代码编辑原则，其中数据的导入由JavaScript负责，数据解析由JavaScript负责，数据显示由JavaScript+jQuery负责。
示例所要呈现的数据完全独立，并以Access数据库格式进行存储，数据容量可以自由增减，不受程序和页面结构的限制。
本示例不需要后台服务器技术的支持，因此对于广大初学者来说，可以在本地或远程上自由进行调试和运行。