jQuery中需要注意的细节问题小结 详细出处参考：http://www.jb51.net/article/29076.htm

1. $.find()与$.children()的区别 
有如下HTML片段： 
复制代码 代码如下:
<div id="div_four"> 
<input id="one"/><input id="two"/> 
<div><input id="three"/></div> 
</div> 


1. find() 返回元素下所有指定元素，不限制子级的深度，如： 
$("#div_four").find("input")//返回one、two、three三个input元素 
2.childr() 返回元素的一级子节点元素集合，如： 
$("#div_four").children("input")//返回one、two两个input元素 
2. $.append()与$.appendTo()的区别 
1. append()：返回父元素的引用 
2. appendTo()：返回新创建的元素的引用 
复制代码 代码如下:
<div id="div_1"></div> 
var e = $("<h1>动态创建并添加表标题元素</h1>").appendTo($("#div_1")); 
var r = $("#div_1").append("<h1>动态创建并添加表标题元素</h1>"); 
//e 表示新创建的<h1>元素 
//r 表示$("#div_1")元素 


3. 动态绑定事件和静态添加事件的区别 
有了jQuery后，给元素动态绑定事件变得很简单，但传统方式直接给元素添加事件也不能忘了，但综合了jQuery和普通JavaScript的程序在使用时必须明确jQuery动态绑定事件和静态添加事件在获得事件源对象的不同之处。 
<p id="p1">动态绑定事件和静态添加事件的区别</p> 
<p id="p2" onclick="fun()">动态绑定事件和静态添加事件的区别</p> 
<p id="p3" onclick="fun2(this)">动态绑定事件和静态添加事件的区别</p> 
//1. 动态绑定事件，this即代表事件源。如： 
$("#p1").click(function(){ 
alert($(this).text()); //this代码事件源 
}); 
//2. 静态绑定事件时，不能直接使用this。如： 
function fun(){ 
alert($(this).text); //不能获得<p>的内容 
//3. 通过传递“this"后即可获得事件源 
function fun2(obj){ 
alert($(obj).text());//将obj包装为jQuery对象 
4. 事件处理函数中this和$(this)的区别 
$("#p1").click(function(){ 
alert(this.innerHTML); //直接使用this 
alert($(this).text()); //将this包装为jQuery对象 
}); 
如上代码中this代表事件源对象，但直使用this时它是HTML DOM对象； 
$(this)可以将HTML DOM对象包装为jQuery对象，即拥有jQuery对象的属性和方法。 
5. $.remove()和$.remove(selector)的区别 
两种调用形式都返回方法前选择器选中的元素 
1. remove():将自身从父元素中删除【自杀】 
2. remove(expr):从父元素中删除某元素【他杀】 
如： 
var e = $("#div_2 h1").remove();//返回删除了的h1元素 
var e = $("#div_2 h1").remove("#h2");//删除id为h2的<h1>元素，返回所有h1元素 
6. $.eq()和$.get()的区别 
相同点：都可获得元素集合中指定第n个元素 
不同点： 
1. eq(n) 返回的是jQuery对象，可以直接使用jQuery内置方法，如： 
复制代码 代码如下:
$("#div_three a").eq(0).bind("click", function () { 
alert($(this).text()); 
}); 


2. get(n) 返回的DOM Element对象，可以直接使用HTML DOM属性和方法，如： 
$("#div_three a").get(1).onclick = function () { 
alert($(this).text()); 
}; 
或将对象封装成jQuery对象达到一样的效果，如： 
复制代码 代码如下:
$($("#div_three a").get(1)).bind("click",function () { 
alert($(this).text()); 
}); 


7. $.css(properties)和$.css(name,value)的区别 
1. 语法的区别 
css(properties) $("p").css({color:"red"}); 或 $("p").css({"color":"red"}); 
css(name,value) $("p").css("color":"red"); 
2.属性名的区别 
css(properties)： 
如果样式属性名没有用引号，则必须用JavaScript语法的css样式名：如 
$("p").css({color:"red",fontSize:"30px"}); 
如果改为“font-size”就没有效果 
如果样式属性名有用引号 ，则两种样式都可以，如： 
$("p").css({color:"red","font-size":"30px","fontWeight":"bold"}); 
css(name,value)：两种形式都可以，下面两种效果一样： 
$("p").css("fontSize":"30px"); 
$("p").css("font-size":"30px"); 

详细出处参考：http://www.jb51.net/article/29076.htm

8.paren()t和parents

  parent:取得一个包含着所有匹配元素的唯一父元素的元素集合

  parents:取得一个包含着所有匹配元素的祖先元素的元素集合（不包含根元素）。可以通过一个可选的表达式进行筛选

9.eq和get和[]

第一个是取jquery对象数组的索引，后面两个是取html的dom,取完之后不是jquery对象

10.bind  live  delegate  on的区别

bind

live：动态绑定到document上，查找费劲，效率没有delegate高

        前面三个的实现都是基于on，on的两种写法

        1.$("a").on("click",function(){})-----这种效果和bind一样

         2.$("#parentId").on("click","#thisId",function(){})-----这和delegate效果一样，动态加载

  3.前面都是父元素（委托的时候，无论是on还是delegate，on和click紧密相连）

$("div").delegate("button","click",function(){  $("p").slideToggle();});

$( "#members li a" ).on( "click", function( e ) {} ); $( "#members li a" ).bind( "click", function( e ) {} ); // Live$( document ).on( "click", "#members li a", function( e ) {} ); $( "#members li a" ).live( "click", function( e ) {} );// Delegate$( "#members" ).on( "click", "li a", function( e ) {} ); $( "#members" ).delegate( "li a", "click", function( e ) {} );

11.jquery查找元素小技巧

    选择器之间的空格和find函数的含义一致：查找所有的子元素，不分层次，parents函数也是这样  eg:  $(".parentDiv .childrenDiv")

     > ----这个和children的含义一致，都只在第一层子元素中查找，同时parent函数也是一样

     +-----$("label + input")   匹配所有跟在 label 后面的 input 元素

     选择器中间的逗号------将每一个选择器匹配到的元素合并后一起返回    eg: $(".class1 , .class2")

12.mouseout和mouseleave：前者是无论离开的是本元素还是子元素，都变化，而后者则是离开父元素的时候才执行

13.

1.针对标签对象元素，比如数html页面有多少个段落元素<p></p> 那么此时的$("p").size() == $("p").length2 .计算一个字符串的长度或者计算一个数组元素的个数那么此时只能用length而不能用size()

14 return false慎用

实际上做了三件事情：
event.preventDefault();---阻止默认
event.stopPropagation();---阻止冒泡
停止回调函数执行并立即返回。
return true：返回正确的处理结果。
return false返回错误的处理结果以及组织代码继续向下执行。
return：将把握权返回给页面
jquery each 或者原生js的 forEach中，return true = continue; return false=break;
15.js给对象赋值方法：
1.var obj = {};obj.id = '1';
2.var obj = {};obj["id"] = '1';
16.$("ancestor descendant")---空格是找所有的子孙后代 (这个相当于函数find)  $("parent>children")---右括号是找父元素的子元素，就一级（这个相当于函数children）
      $("id + input")---id后面的所有的包括同级的和id这级下面的匹配input的
      $("prev ~ siblings")---匹配 prev 元素之后的所有 siblings 元素
匹配所有跟在 label 后面的 input 元素，HTML 代码:
<form>  <label>Name:</label>  <input name="name" />  <fieldset>      <label>Newsletter:</label>      <input name="newsletter" /> </fieldset></form><input name="none" />
jQuery 代码:
$("label + input")
结果:
[ <input name="name" />, <input name="newsletter" /> ]