JQuery-学习总结及实例.docx

HYPERLINK /daomul/archive/2013/04/26/3037737.html JQuery 学习总结及实例 1、JQuery简介 ? ? ? 普通JavaScript的缺点：每种控件的操作方式不统一，不同浏览器下有区别，要编写跨浏览器的程序非常麻烦。因此出现了很多对JavaScript 的封装库，比如Prototype、Dojo、ExtJS、JQuery等，这些库对JavaScript进行了封装，简化了开发。这些库是对 JavaScript的封装，也就是咱们调用JQuery的一句函数，JQuery内部这句函数帮我们调用JavaScript中的代码几十句，因为JQuery就是JavaScript语法写的一些函数类，内部仍然是调用JavaScript实现的，所以并不是代替JavaScript的。使用JQuery的代码、编写JQuery的扩展插件等仍然需要JavaScript的技术，Jquery本身就是一堆JavaScript函数。 ? ? ? ? ? ? ?（1、Jquery是最火的JavaScript库，已集成到VS2010，MS的Ajax toolkit和JQuery结合也是最方便，JQuery的扩展插件也是非常多。 ? ? ? ? ? ?（2、JQuery的优点：尺寸小、使用简单方便（Write Less, Do More，吃得少干得多。 ? ? ? ? ? ? ? ? ? ? ?链式编程（$(#div1).draggble().show().hide().fly()）、 ? ? ? ? ? ? ? ? ? ? ?隐式迭代??（自动对于多个元素进行迭代方法调用））、 ? ? ? ? ? ? ? ? ? ? 屏蔽浏览器差异跨浏览器兼容性好（IE 6.0+, FF 2+, Safari 3.0+, Opera 9.0+, Chrome）、插件丰富、?开源、免费。 ? ? ? ? ? ?（3、VS中JavaScript、JQuery的自动完成功能：在VS2010中直接有，VS008需要安装VisualStudio 和VS90SP1-KB958502-x86补丁会更强更好用, 下 ? ? ? ? ? ? ? ? ? ?载地址见备注。然后引用jquery-1.4.1.js，jquery-1.4.1-vsdoc.js放到同目录下，不需要在页面引用。 ? ? ? ? ? ?（4、vsdoc是vs2008sp1以后增加的一个技术，将js文件对应的vsdoc（相当于js库提供的方法的说明库）放到和js一起，就有会第三方js的自动提示的功能 ? 2、简单的JQuery之Ready ? ? ? ?（1、注册事件的函数，和普通的dom不一样，不需要在元素上标记on**这样的事件。 $(document).ready(function(){ ???????????alert(加载完毕！); ???????}); （2、当页面Dom元素加载完毕时执行代码，可以简写为： ????????$(function(){ ???????????alert(加载完毕！); ??????}); ? ? ? （3、和onload类似，但是onload只能注册一次（没有C#中的+=机制），后注册的取代先注册的，而ready则可以多次注册都会被执行。 ? ? ? ? ? ? ? ? ? ? window.onload=function(){alert(1)};window.onload=function(){alert(2)};//结果只弹出2 ? ? ? （4、JQuery的ready和Dom的onload的区别(*)：onload是所有Dom元素创建完毕、图片、Css等都加载完毕后才被触发，而ready则是Dom元素创建完毕后就被触发，这样可以提高网页的响应速度。在jQuery中也可以用$(window).load()来实现onload那种事件调用的时机。 ? ? ? ? ? ?$(function(){alert(1111);});//简写方式 ? 3、JQuery的函数 ? ??$.map(array,fu) 得到函数的返回值和$.each(array,fn)调用函数处理没有返回值 1 !DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN /TR/xhtml1/DTD/xhtml1-transitional.dtd 2 html xmlns=/1999/xhtml 3 head 4 title/title 5 script src=js/jquery-1.4.2.js type=text/javascript/script 6 scrip