[置顶]       JQuery基础知识

优点： 可跨浏览器编程。还有Prototype、Dojo、ExtJS(功能更强的JS库，常用与企业级程序)。 宗旨：Write Less, Do More 本质： JavaScript库。 JQuery能做什么？ 与DOM功能相同。 导入 <script src="xxx.js" type="text/javascript"></script> 1：“$”符号 方法名(jQuery方法的别名) window.jQuery = window.$ = jQuery 作用：筛选对象 $通常使用选择器来获得相应的对象集合（id选择器#id，类选择器tagName） 2：$(docuemnt).ready方法： 会在当前浏览器加载生成完整个DOM树完成之后调用（相当于window.onload），并可以多次调用相当于C#中的“+=”; 与onload的区别 onload是所用DOM元素创建完毕、图片、CSS等都加载完毕后才被触发，而ready则是DOM元素创建完毕后就被出发，这样可以提高网页的响应速度，在JQuery中也可以用$(window).load()来实现onload事件的调用机制。 简写：$(function() {}); 3：JQuery对象转换为DOM对象 1）[index] 2）get(inde) 4：选择器 id选择器-->#id 类选择器-->tagName class选择器-->.className *选择器-->* 选择所有的元素 组合选择器-->使用“,”作为分隔符 $("#msgDiv, msg2Div") 层次选择器 -->后代选择器：ancestor decendant使用空格作为分隔符 $("form input") -->子代选择器：$("parent> child") --> 匹配所有紧接在prev后的next元素 $("prev + next") -->匹配prev元素之后的所有siblings兄弟元素 $("prev ~ siblings") 5：浏览器解析JS代码时，会先解析声明式代码。eg:function()[] 之后在加载运行式代码 6：JQuery中注册事件监听click()、leave()、focus()、blur().... JQuery中注册事件监听本质：调用IE中attchEvent、FireFox中addEventListener 7：JQuery提供的函数 JQuery其实就是一个方法，方法的本质就是对象，对象是可以有方法属性，所以JQuery方法也有它自己的方法。 7.1 $.map(array, fn(){})：用来将一个数组，转换成另一个数组。 如果传入的匿名方法的参数是一个，那么这个参数就是当前被循环出的数组元素。function(item){} 如果传入的匿名方法的参数是两个，则第一个是被循环出来的数组元素，第二个为当前被循环到的小角标。function(item, index){} 如果map时的匿名函数中包含return语句，那么map方法就会有一个返回值，返回的是由return语句返回单个元素组成的新数组。 $.map不能处理json格式对象的数组 注意：JS中的任何方法都有返回值，如果用户不手动返回的话，就会返回undefined 7.2 $.each(array, fn(){})：对数组array每个元素调用fn函数进行处理，没有返回值。$.each(arr, function(key, value){ alert(key + '=' + value ); }); 如果each循环数组的话，那么key就是下标，value就是元素 在each循环时，只要回调函数返回了false，那么循环终结 $.map与$.each区别：是否有返回值 7.3 $.trim(str) str.replace(/^[\sxA0]+/, "").replace(/[\sxA0]+$/, ""); xA0 也是空格 7.4 .text()获得元素内部的文本 .text(val)向元素内部添加文本 .html()和html(val)获取或设置标签内的html标签 8：Json Json其实就是js中对象的一种表示方法(字面量表示法) 注意：值类型的变量，不能动态添加属性。 9：JQuery对象就是通过JQuery包装DOM对象后产生的对象 $('#div1').html()等价于document.getElementById('div').innerHTML $(".class,#id,div").css() == document.getElementById().style css("border", "3px solid #000"0: $().val() == .value() 10：Array是JS的对象，所以JQuery和DOM都能使用 11：JQuery绑定事件支持多播 12：过滤器 :first :last :eq(index)索引 :gt(index) 大于 :lt(index)小于 :not() :even :odd :header $("div[id]")属性过滤选择器 $("div[name^='x']")：name属性以x开头的div元素 $("div[name$='x']")：结尾 $("div[][]"); $("div[name*='x']")：包含 $("*:disabled"); $("*:enabled");
$("input:checked");Radio CheckBox $("input:selected"); 下拉列表<select .../> 12:<a .../>不跳转，设置href="javascript:void(0)"; 13：合成事件$(selector).hover(funcIn, funcOut); 14：对JQuery顶层对象进行扩展$.extend({}); 15：对JQuery元素进行扩展$.fn.extend({}); 16：常用的JS插件 JQueryUI JQueryEasyUI JQueryCookie