jQuery集锦.docx

1、 jquery对象和dom对象相互转换书写规范：在jquery对象变量的前方带有$前缀var$variable=jQuery对象;varvariable=Dom对象;jquery对象转换为dom对象：jquery对象提供了两种方法：index和get(index)var$cr=$(“#cr”);/获取jquery对象varcr=$cr0;或者var$cr=$(“#cr”);/获取jquery对象varcr=$cr.get(0);dom对象转换为jquery对象，只需要使用$()将dom对象包含起来即可，如：varcr=document.getElementById(“cr”);/获取dom对象var$cr=$(cr);在jquery中$既是jQuery的别名，所以将一个Dom对象转换成jQuery对象，也可以这样写：varcr=document.getElementById(“cr”);var$cr=jQuery(cr);2、 jquery使用$作为自身的快捷方式3、 解决jQuery和其他库的冲突（conflict）在导入了jQuery和其他库后，可以在任何使用都可以调用jQuery.noConfilct()函数来将变量$的控制权移交给其他的JavaScript库。同样，也可以自己创建一个快捷方式：var$j=jQuery.noConflict();/自定义一个快捷方式4、 jQuery中如何检测一个元素是否存在在DOM中：if(document.getElementById(“tt”)document.getElementById(“tt”).style.color=”red”;在jQuery中：如果使用if($(“#tt”)是无效的，因为即使在页面中找不到tt这么个元素，jQuery也会返回一个jQuery对象。改进后，有两种方式判断一个元素是否存在：1） if($(“#tt”).length0)/jQuery对象长度是否为02） if($(“#tt”)0)/转换成DOM对象5、 jQuery选择器1） 基本选择器选择器描述返回示例#id根据给定的id匹配一个元素单个元素$(“#test”)选取id为test的元素.class根据给定的类名匹配元素集合元素$(“.test”)选取所有class为test的元素*匹配所有元素集合元素$(“*”)选取所有元素selector1,selector2,.,selectorN将每一个选择器匹配到的元素合并后一起返回元素集合$(“div,span,p.myClass”)选取所有,和拥有class为myClass的标签的一组元素2） 层次选择器选择器描述返回示例$(“ancestordescendant”)选取ancestor元素里的所有descendant（后代）元素集合元素$(“divspan”)选取里的所有的元素$(“parentchild”)选取parent元素下的child元素，与$(“ancestordescendant”)有区别，$(“ancestordescendant”)选择的是后代元素集合元素$(“divspan”)选取元素下元素名为的子元素$(“prev+next”)选取紧接在prev元素后的next元素集合元素$(“.one+div”)选取class为one的下一个元素$(“prevsiblings”)选取prev元素之后的所有siblings元素集合元素$(“#twodiv”)选取id为two的元素后面的所有兄弟元素等价关系：选择器方法等价关系$(“.one+div”)$(“.one”).next(“div”);等价关系$(“#prevdiv”)$(“#prev”).nextAll(“div”);siblings()方法和$(“#prevsiblings”)选择器比较$(“#prevdiv”)选择器只能选择“#prev”元素后面的同辈元素。而siblings()方法与前后关系无关，只要是同辈节点就能够匹配。3） 过滤选择器a) 基本过滤选择器描述返回示例:first选取第1个元素单个元素$(“div:first”)选取所有元素中第1个元素:last选取最后一个元素单个元素$(“div:last”)选取所有元素中最后一个元素:not(selector)去除所有与给定选择器匹配的元素集合元素$(“input:not(.myClass)”)选取class不是myClass的元素:even选取索引是偶数的所有元素，索引从0开始集合元素$(“input:even”)选取索引是偶数的元素:odd选取索引是奇数的所有元素，索引从0开始集合元素$(“input:odd”)选取索引是奇数的元素:eq(index)选取索引等于index的元素（index从0开始）单个元素$(“input:eq(1)”)选取索引等于1的元素:gt(index)选取索引大于index的元素（index从0开始）集合元素$(“input:gt(1)”)选取索引大于1的元素:lt(index)选取索引小于index的元素（index从0开始）集合元素$(“input:lt(1)”)选取索引小于1的元素:header选取所有的标题元素，例如h1,h2,h3等等集合元素$(“:header”)选取网页中所有的,.:animated选取当前正在执行动画的所有元素集合元素$(“div:animated”)选取正在执行动画的元素b) 内容过滤选择器描述返回示例:contains(text)选取含有文本内容为text的元素集合元素$(“div:contains(我)”)选取含有文本“我”的元素:empty选取不包含子元素或者文本的空元素集合元素$(“div:empty”)选取不包含子元素（包含文本元素）的空元素:has(selector)选取含有选择器所匹配的元素的元素集合元素$(“div:has(p)”)选取含有元素的元素:parent选取含有子元素或者文本的元素集合元素$(“div:parent”)选取拥有子元素（包含文本元素）的元素c) 可见性过滤选择器描述返回示例:hidden选取所有不可见的元素集合元素$(“:hidden”)选取所有不可见的元素。包括,和等元素。如果只想选取元素，可以使用$(“input:hidden”):visible选取所有可见的元素集合元素$(“div:visible”)选取所有可见的元素可见性选择器中，需要注意选择器：hidden，它不仅包含样式属性display为“none”的元素，也包括文本隐藏域()和visibility:hidden之类的元素。d) 属性过滤选择器描述返回示例attribute选取拥有此属性的元素集合元素$(“divid”)选取拥有属性id的元素attribute=value选取属性的值为value的元素集合元素$(“divtitle=test”)选取属性title为“test”的元素attribute!=value选取属性的值不等于value的元素集合元素$(“divtitle!=test”)选取属性title不等于“test”的元素（注意：没有属性title的元素也会被选取）attribute=value选取属性的值以value开始的元素集合元素$(“divtitle=test”)选取属性title以“test”开始的元素attribute$=value选取属性的值以value结束的元素集合元素$(“divtitle$=test”)选取属性title以“test”结束的元素attribute*=value选取属性的值含有value的元素集合元素$(“divtitle*=test”)选取属性title含有“test”的元素selector1selector2selector3用属性选择器合并成一个复合属性选择器，满足多个条件。没选择一次，缩小一次范围集合元素$(“dividtitle$=test”)选取拥有属性id，并且属性title以“test”结束的元素e) 子元素过滤选择器描述返回示例:nth-child(index/even/odd/equation)选取每个父元素下的第index个子元素或者奇偶元素.(index从1算起)集合元素:eq(index)只匹配一个元素，而:nth-child将为每一个父元素匹配子元素，并且:nth-child(index)的index是从1开始的，而:eq(index)是从0算起:first-child选取每个父元素的第1个子元素集合元素:first只返回单个元素，而:first-child选择符将为每个父元素匹配第1个子元素。例如：$(“ulli:first-child”);选取每个中第1个元素:last-child选取每个父元素的最后一个子元素集合元素同样，:last只返回单个元素，而:last-child选择符将为每个父元素匹配最后一个子元素。例如：$(“ulli:first-child”);选择每个中最后一个元素:only-child如果某个元素是它父元素中唯一的子元素，那么将会被匹配。如果父元素中含有其他元素，则不会被匹配集合元素$(“ulli:only-child”)在中选取是唯一子元素的元素:nth-child()选择器是很常用的子元素过滤选择器，详细功能如下：:nth-child(even)能选取每个父元素下的索引值是偶数的元素:nth-child(odd)能选取每个父元素下的索引值是奇数的元素:nth-child(2)能选取每个父元素下的索引值是2的元素:nth-child(3n)能选取每个父元素下的索引值是3的整数倍的元素（n从0开始）:nth-child(3n+1)能选取每个父元素下的索引值是（3n+1）的元素（n从0开始）f) 表单对象属性过滤选择器描述返回示例:enabled选取所有可用元素集合元素$(“#form1:enabled”);选取id为form1的表单中的所有可用元素:disabled选取所有不可用元素集合元素$(“#form2:disabled”)选取id为form2的表单中所有不可用元素:checked选区所有被选中的元素（单选框、复选框）集合元素$(“input:checked”);选取所有被选中的元素:selected选取所有被选中的选项元素（下拉列表）集合元素$(“select:selected”);选取所有被选中的选项元素4） 表单选择器选择器描述返回示例:input选取所有的、和元素集合元素$(“:input”)选取所有和元素:text选取所有的单行文本框集合元素$(“:text”)选取所有的单行文本框:password选取所有的密码框集合元素:radio选取所有的单选框集合元素:checkbox选取所有的单选框集合元素:submit选取所有的提交按钮集合元素:image选取所有的图像按钮集合元素:reset选取所有的重选按钮集合元素:button选取所有的按钮集合元素:file选取所有的上传域集合元素:hidden选取所用的不可见元素集合元素6、 解决jQuery和其他类库的冲突（conflict）因为在其他的javascript类库中，也会使用$变量作为类库对象的引用，比如Prototype。但一个页面需要同时使用两个脚本库时，就会产生冲突，导致$变量的引用不明确。jQuery提供了jQuery.noConflict()和jQuery.noConflict(extreme)两个方法。作用是将$变量的控制权交给第一个实现它的类库。如果extreme参数为true即表示同时将jQuery变量的控制权也转交出去。也许有的脚本中不仅仅占用了$变量而且连jQuery变量也给占用了。使用jQuery.noConflict()时需要注意：头部的类库引用必须将jQuery脚本库的引用放在最最后面才可以。否则无法使用，例如：7、 可见性过滤中hidden和visible的区别:hiddenElementscanbeconsideredhiddenforseveralreasons:Theyhavaacssdisplayvalueofnone.Theyareformelementswithtype=”hidden”.Theirwidthandheightareexplicitlysetto0.Anancestorelementishidden,sotheelementisnotshownonthepage.Elementswithvisibility:hiddenoropacity:0(不完全透明度：0)areconsideredtobevisible,sincetheystillconsumespaceinthelayout.(只要在布局流中任然占用空间，就不是hidden匹配项，只有那些完全从布局流中消失的元素才是hidden匹配的).Duringanimationsthathideanelement,theelementisconsideredtobevisibleuntiltheendoftheanimation.Duringanimationstoshowanelement,theelementsisconsideredtobevisibleatthestartoftheanimation.Anelementisassumedtobehiddenifitoranyofitsparentsconsumesnospaceinthedocument.8、 prepend()和prependTo()方法比较.prepend(content,content)Parameter:content-Domelement,arrayofelements,HTMLstring,orjQueryobjecttoinsertatthebeginningofeachelementinthesetofmatchedelements.The.prepend()methodinsertsthespecifiedcontentasthefirstchildofeachelementinthejQuerycollection(Toinsertitasthelastchild,use.append().The.prepend()and.prependTo()methodsperformthesametask.Themajordifferenceisinthesyntax-specifically,intheplacementofthecontentandtarget.With.prepend(),theselectorexpressionpreceding(前方的、前面的)themethodisthecontainerintowhichthecontentisinserted.With.prependTo(),ontheotherhand,thecontentprecedesthemethod,eitherasaselectorexpressionorasmarkupcreatedonthefly,anditisinsertedintothetargetcontainer.$(“p”).prepend(“ssss”);$(“ssss”).prependTo(“p”);后者是无法执行的。只能写成带html-tag的形式如：$(“ssss”).prependTo(“p”);9、 css()方法设置样式$(“p”).css(“color”,”red”);$(“p”).css(“fontSize”:”30px”,”backgroundColor”:”#888”);在css()方法中，如果属性带有-符号，例如：font-size和background-color属性，如果在设置这些属性的时候不带引号，那么就要用驼峰命名法，例如：$(“p”).css(fontSize:“30px”,backgroundColor:“#888”);如果戴上了引号，既可以写成”font-size”，也可以写成”fontSize”。建议带上引号。10、height()方法和width()方法如果需要获取某个元素的height属性，则可以通过如下实现：$(element).css(“height”);同样还可以通过height()方法$(“element”).height();两者的区别是：css()方法获取的高度值与样式的设置有关，可能会得到“auto”，也可能得到“10px”之类的字符串；而height()方法获取的高度值则是元素在页面中的实际高度，与样式的设置无关，并且不带单位。使用css()得到的样式带有单位，不能用于计算。而width()和height()得到的样式没有单位，可用于计算。11、 jQuery中的$(document).ready()、$(window).load()方法和JavaScript中的window.onload方法的区别a、执行时机：window.onload方法是在网页中所有的元素（包括元素的所有关联文件）完全加载到浏览器后才执行，即javascript此时才可以访问网页中的任何元素。而通过jQuery中的$(document).ready()方法，在DOM完全就绪是就可以被调用。此时，网页的所有元素对jQuery而言都是可以访问的，但是，这并不意味着这些元素关联的文件都已经下载完毕。另外，需要注意一点，由于在$(document).ready()方法内注册的事件，只要DOM就绪就会被执行，因此可能此时元素的关联文件未下载完。例如与图片有关的html下载完毕，并且已经解析为DOM树了，但很有可能图片还未加载完毕，所以图片的高度和宽度这样的属性此时就不一定有效。要解决这个问题，可以使用jQuery中另一个关于页面加载的方法-load()方法。Load()方法会在元素的哦你load事件中绑定一个处理函数。如果处理函数绑定给window对象，则会在所有内容（包括窗口、框架、对象和图像等）加载完毕后触发，如果处理函数绑定在元素上，则会在元素的内容加载完毕后触发。jQuery代码如下：$(window).load(function().)等同于：window.onload=function()b、多次使用：javascript的onload事件一次只能保存对一个函数的引用，它会自动用后面的函数覆盖前面的函数，因此不能在现有的行为上添加新的行为。而jQuery的$(document).ready()方法每次调用都会在现有行为上追加新的行为，这些行为函数会根据注册的顺序依次执行。11、bind()方法bind(eventType,eventData,handler);parametereventType：thejquerylibraryprovidesshortcutmethodsforbindingthestandardeventtypes,suchas.click()for.bind(“click”).Adescriptionofeachcanbefoundinthediscussionofitsshortcutmethod:blur,focus,focusin,focusout,load,resize,scroll,unload,click,dblclick,mousedown,mouseup,mousemove,mouseover,mouseout,mouseenter,mouseleave,change,select,submit,keydown,keypress,keyup,errorunbind(eventType,handler(eventObject)returnjQueryanyhandlerthathasbeenattachedwith.bind()canberemovedwith.unbind().Inthesimplestcase,withnoarguments,.unbind()removesallhandlersattachedtotheelements:$(#foo).unbind();Thisversionremovesthehandlersregardlessoftype.Tobemoreprecise,wecanpassaneventtype:$(#foo).unbind(click);Byspecifyingtheclickeventtype,onlyhandlersforthateventtypewillbeunbound.$(#btn).bind(“click”,myFun=function();$(#btn).unbind(“click“,myFun”);12、：hidden和：visible过滤器首先参照第七条。在css样式代码中要想叫一个div隐藏，不能使用visibility：hidden（这时系统认为该div的是可视的）。应使用display：none；13、 hover(handlerIn(eventObject),handlerOut(eventObject)returnjQuerythe.hover()methodbindshandlersforbothmouseenterandmouseleaveevents.Youcanuseittosimplyapplybehaviortoanelementduringthetimethemouseiswithintheelement.Calling$(selector).hover(handlerIn,handlerOut)isshorthandfor$(selector).mouseenter(handlerIn).mouseleave(handlerOut);14、 toggle(duration,callback)returnjQuerywithnoparameters,the.toggle()methodsimplytogglesthevisibilityofelementsthematchedelementswillberevealedorhiddenimmediately,withnoanimation,bychangingthecssdisplayproperty.Iftheelementisinitiallydisplay,itwillbehidden;ifhidden,itwillbeshown.Thedisplaypropertyissavedandrestoredasneeded.Ifanelementhasadisplayvalueofinline,thenishiddenandshown,itwillonceagainbedisplayedinline.Whenadurationisprovided,.toggle()becomesananimationmethod.The.toggle()methodanimatesthewidth,height,andopacityofthematchedelementssimultaneously.Whenthesepropertiesreach0afterahidinganimation,thedisplaystylepropertyissettononetoensurethattheelementnolongeraffectsthelayoutofthepage.Durationsaregiveninmilliseconds;highervaluesindicatesloweranimations,notfasterones.Thestringsfastandslowcanbesuppliedtoindicatedurationsof200and600milliseconds,respectively.15、 show()/hide()hide()方法，会将该元素的display样式改为“none”show()方法和hide()方法在不带任何参数的情况下，相当于css(“display”,”none/block/inline”)，作用是立即隐藏或显示匹配的元素，不会有任何动画。如果希望在调用show()方法时，元素慢慢地显示出来，可以为show()方法指定一个速度参数：slow-600msnormal-400msfast-200ms16、 jQuery动画效果对模式的要求用jQuery做动画效果要求要在标准模式下，否则可能会引起动画抖动。标准模式即在文件头部包含如下的DTD定义17、 jQuery中div做动画时注意事项：div必须事先显式声明：position:absolute然后再做动画。如：#testposition:absolute;border:red2pxsolid;width:100px;height:100px;text-align:center;cursor:pointer;$(function()$(#test).toggle(function()$(this).animate(left:500px,3000);,function()$(this).animate(left:0px,3000););)animationtest!18、 jQuery中的attr()方法使用说明先来看官方的：attr(attributeName,value)returns:jQueryThe.attr()methodisaconvenientwaytosetthevalueofattributes,especiallywhensettingmultipleattributesorusingvaluesreturnedbyafunction.$(“#ele”).attr(“alt”:”haha”,”title”:”nihao”);WARNING:whensettingtheclassattribute,youmustalwaysusequotes!Note:InternetExplorerdoesnotallowyoutochangethetypeattributeofanorelement.在实际使用中发现：在给属性这样一个名值对赋值时：值有时候不能带引号，尤其是Boolean类型时。另外在调用某一元素的某一属性时，如果该属性值是boolean类型的，需要做强制类型转换。$(name=items2:checkbox).attr(checked,(Boolean)($(this).attr(checked)19、 jQuery对元素数据的保存原来想对html元素保存一个数据，往往利用alt属性，但是这是一种不符合html语意的使用方式：$(“selector”).attr(“alt”,”databeingstored”);$(“selector”).attr(“alt”);一个好的方案是,使用jQuery的data方法来保存数据：$(“selector”).data(“parameter”,”databeingstored”);$(“selector”).data(“parameter”);与此相对应的是removeData()方法，20、 书写jQuery好的建议 优先使用ID选择器：在jQuery中最快的选择器是id选择器，其次是tag选择器，最后才是class选择器。如果要遍历多个dom节点，从最近的id选择器开始如：vartraffic_lights=$(#traffic_lightinput); 在class选择器前使用tag标签varactive_light=$(input.on);也可以结合最近的id选择器：varactive_light=$(#traffic_lightinput.on);同时注意：不要使用tag来修饰id，也不要使用id来修饰id 使用上下文选择器jQuery(expression,context); 搞清子选择器和后代选择器子选择器()父元素的子元素，而后代选择器是某节点元素的所有内嵌元素包括子元素，子元素的子元素。 将jquery对象缓存为var变量，然后再对其进行操作 为了区分javascript对象和jquery对象，在jquery对象的前面加$以区分 优先使用jQuery链式结构 Dom的操作很慢，而循环的操作很快vartop_100_list=.,/假设这里是100个独一无二的字符串$mylist=$(#mylist);/jQuery选择到元素for(vari=0,l=top_100_list.length;il;i+)$mylist.append(+top_100_listi+);我们应该将整套元素字符串在插入进dom中之前先全部创建好，如下所示：vartop_100_list=.;var$mylist=$(#mylist);vartop_100_li=;/这个变量将用来存储我们的列表元素for(vari=0,l=top_100_list.length;il;i+)top_100_li+=+top_100_listi+;$mylist.html(top_100_li); 避免DOM操作对DOM的操作最常见的有append，prepend，after等等，比较耗时，最好改为html，上段代码的最后一句就是最好的示例 如果函数无返回值，就让他返回false，特别在事件绑定中 避免使用concat（），尽量使用join（）来处理长字符串vararray=;for(vari=0;i=10000;i+)arrayi=+i+;$(#list).html(array.join(); 优先使用$(window).load事件 关于事件的冒泡除非在特殊情况下,否则每一个js事件(例如:click,mouseover等.)都会冒泡到父级节点。当我们需要给多个元素调用同个函数时这点会很有用。代替这种效率很差的多元素事件监听的方法就是,你只需向它们的父节点绑定一次。比如,我们要为一个拥有很多输入框的表单绑定这样的行为:当输入框被选中时为它添加一个class传统的做法是，直接选中input，然后绑定focus等，如下所示：$(#entryforminput).bind(focus,function()$(this).addClass(selected);).bind(blur,function()$(this).removeClass(selected););当然上面代码能帮我们完成相应的任务，但如果你要寻求更高效的方法，请使用如下代码：$(#entryform).bind(focus,function(e)var$cell=$(e.target);/e.target捕捉到触发的目标元素$cell.addClass(selected);).bind(blur,function(e)var$cell=$(e.target);$cell.removeClass(selected););通过在父级监听获取焦点和失去焦点的事件，对目标元素进行操作。在上面代码中，父级元素扮演了一个调度员的角色,它可以基于目标元素绑定事件。如果你发现你给很多元素绑定了同一个事件监听,那么现在的你肯定知道哪里做错了。同理，在Table操作时，我们也可以使用这种方式加以改进代码：普通的方式：$(#myTabletd).click(function()$(this).css(background,red););改进方式：$(#myTable).click(function(e)var$clicked=$(e.target);$clicked.css(background,red););假设有100个td，在使用普通的方式的时候，你绑定了100个事件。在改进方式中，你只为一个元素绑定了1个事件，至于是100个事件的效率高，还是1个事件的效率高，相信你也能自行分辨了。 使用data临时存储数据下面是一段非常简单的代码：$(function()varflag=false;$(button).click(function()if(flag)$(p).text(true);flag=false;else$(p).text(false);flag=true;);)改用data()方式后，代码如下：$(function()$(button).click(function()if($(p).data(flag)$(p).text(true);$(p).data(flag,false);else$(p).text(false);$(p).data(flag,true););)交通信号灯红色黄色绿色21、 十大遍历函数在下面提到的网页中，当一个star被点击时，我们需要给它以及左边的每个star添加class“on”。首先，让我们看看下图所示的简单的页面，通过这个教程我们将选择这些元素。div.container是包裹元素；div.photo、div.title、div.rating是div.container的直接子级；每个div.star是div.rating的子级；当div.satr的class为“on”时，它是一个完整的star。与此同时，我们要改变所有star父元素的背景颜色，因此，我们的代码如下：$(.star).click(function()$(this).addClass(on);/如何选取当前对象的父元素?/如何获得当前star左侧所有的star?);在第二行，我们得到了我们点击的当前对象。但是，如何得到stars的父级？即div.rating。但是，在一个页面中，有很多div.rating。哪一个是我们想要的？如何获得“this”左边所有的star？可喜的是，jQuery允许我们基于这些基层关系，在现存集合的基础上获得新的元素集合。而这些正是遍历函数发挥作用的地方。1、children这个函数得到一组元素的直接子级。在很多情况下会很方便，看看下面这张图：开始的时候容器中的star全部被选择；给children()传递一个选择表达式将选择结果缩小至选中的star；如果chilidren()每接受任何参数，将返回所有直接子级；不返回孙级元素。2、filter这个函数通过传递的选择表达式从一个集合中过滤元素。任何不匹配这个表达式的元素将从选择的集合中移除。下面的这个例子直截了当。从5个star中过滤出class为“on”的star。3、not与filter恰恰相反，not()从集合中移除匹配的元素。看下面这个例子。偶数列的star从选择集合中移除，留下的是奇数行的star。“注意：Even和odd选择器是从0开始的，从0开始计数，不是从1。”4、add如果我们想在集合中增加一些元素怎么办？add()函数正是做这件事的。同样简单明了，photo盒子被添加到集合中。5、slice有时候，我们需要根据元素在集合的位置获取集合的子集。sliece()正是做这个的。第一个参数是从零开始的第一个元素的位置，它包含在返回的片段中；第二个参数是从零开始的第一个元素的索引。不包含在返回的片段中。如果省略，将延伸至集合的末尾；所以，slice(0,2)将选取前两个star。6、parentparent()函数选取一系列元素的直接父级。正如下图所示，第一个star的直接父级被选中。非常方便，应当指出，它仅仅返回直接父级，为什么很奇特？因为没有祖父元素或祖先元素被选中。7、parents这是复数形式，parents()选择集合的所有祖先元素。我的意思是所有祖先元素包括直接父级到“body”和“html”元素。所以最好通过传递表达式缩小选择结果。通过给parents()传递.container参数，div.container将被选中，它实际上第一个star的祖父。8、siblings这个函数选择一组元素的所有兄弟姐妹，传递一个表达式可以筛选结果。看看这个例子：如图所示，“odd”的节点被选中。索引是从零开始的，看看下面star的红色数字。9、prev&prevAllprev()函数选择前一个兄弟节点。prevAll()选择一个元素集合前面所有的兄弟节点。如果你正在构建一个星级部件，这将相当方便。第三个star前面的兄弟节点被选中。10、next&nextAll这些函数与prev和prevAll工作方式相同，不过它选择的是下一个兄弟姐妹。结论最后，让我们来看看如何利用这些函数来解决现实世界中令我们头痛的问题。$(.star).click(function()$(this).addClass(on);/如何取得当前对象的父级?$(this).parent().addClass(rated);/如何获得当前对象左侧的star?$(this).prevAll().addClass(on);$(this).nextAll().removeClass(on););22、$