房盟中国 jquery培训.ppt

第四章 4.13动画方法概括 改变样式属性 方法 说明 hide()和show() 同时修改多个样式属性即高度、宽度和不透明度。 fadeIn()和fadeOut() 只改变不透明度。 slideUp()和slideDown() 只改变高度。 fadeTo() 只改变不透明度。 toggle() 用来代替hide()和show()，所以会同时修改多个样式属性。 slideToggle() 用来替换slideUp()和slideDown()，所以只能改变高度。 animate() 属于自定义动画方法，以上各种动画方法实质内部都调用了animate()方法。 动画队列 1.一组元素上的动画效果 1.1当在一个animate()方法中应用多个属性时，动画是同时发生的。 1.2当以链式的写法应用动画方法时，动画是按照顺序发生的。 2.多组元素上的动画效果 2.1默认情况下，动画都是同时进行的。 2.2当以回调的形式应用动画方法时，动画是按照回调顺序发生的。 第五章 jquery对表单/表格的操作及更多应用 第五章 5.1表单应用 单行文本框应用 文本框是表单域中最基本的的元素，基于文本框的应用有很多。此处只简单介绍其中的一个应用—获取和失去焦点改变样式。 jquery代码： $(function(){ $(“:input”).focus(function(){ $(this).addClass(“focus”); }).blur(function(){ $(this).removeClass(“focus”); }); }); 示例 复选框应用 对复选框最基本的应用，就是对复选框进行全选和全不选操作。复杂的操作需要和选项挂钩，来达到各种级联反应效果。 示例 下拉框应用 下拉框有非常多的应用，这里也只选择其中一个常用、典型的应有来介绍。 示例 第六章 Jquery与Ajax的应用 第六章 6.1ajax的优势与不足 Ajax全称为(Asynchronous Javascript and XML)(异步javascript和XML)，它并不是指一种单一的技 术，而是有机地利用了一系列交互式网页应用相关的技术所形成的结合体。它的出现，揭开了无刷 新更新页面的新时代，并代替传统的Web方式和通过隐藏的框架来进行异步提交的趋势，是Web开 发应用的一个里程碑。 Ajax的优势 1.不需要插件支持 ajax不需要任何的浏览器插件，就可以被大多数主流浏览器所支持，用户只需要允许javascript在浏览器上执行即可。 2.优秀的用户体验 这是ajax最大的优点，能在不刷新这个页面的前提下更新数据，这使得web应用程序更为迅速地返回用户的操作。 3.提高web性能 与传统模式相比，ajax模式在性能上最大的区别就在于传输数据的方式，在传统模式中，数据提交是通过表单来实现的，而数据获取是靠全页面刷新来重新获取整页得内容。而ajax模式只是通过XMLHttpRequest对象向服务器提交希望提交的数据，即按即发送。 4.减轻服务器和宽带的负担 ajax工作原理相当于在用户和服务器之间加了一个中间层，使用户操作与服务器响应异步化。它在客户端创建ajax引擎，把传统方式下的一些服务器负担工作转移到客户端。即减轻了服务器和宽带的负担。 第六章 6.1ajax的优势与不足 Ajax的不足 1.浏览器对XMLHttpRequest对象的支持度不足 为了使得ajax应用在各个浏览器中正常运行，程序员必须花费大量的精力编码使得各个浏览器之间能够兼容。这使得ajax开发的难度比普通的web开发高出很多，许多程序员因此对ajax望而生畏。 2.破坏浏览器前进、后退按钮的正常功能 3.对搜索引擎的支持不足 通常搜索引擎都是通过爬虫程序来对互联网上的数以亿计的海量数据进来搜索整理的，然而爬虫程序现在还不能理解那些奇怪的js代码和因此引起的页面内容的变化，这使得应用ajax的站点在网络推广上相对于传统站点明显处于劣势。 4.开发和调试工具的缺乏 第六章 6.2jquery中的Ajax Jquery对ajax操作进行了封装，在jquery中$.ajax()方法属于最底层的方法，第2层是load()、$.get() 和$.post()方法，第3层是$.getScript()和$.getJSON()方法。首先介绍第2层得方法，因为使用频率很高。 load()方法