## 子元素集 children(\[expr\]) 概述：取得一个包含匹配的元素集合中每一个元素的所有子元素的元素集合。 ~~~ $("div").children(); // 查找 DIV 中的每个子元素。 $("div").children(".selected"); // 在每个 div 中查找 .selected 的类。 ~~~ ## 最近上级 closest(expr | object | element) 概述：从元素本身开始，逐级向上级元素匹配，并返回最先匹配的元素。 ~~~ $("li:first").closest("div"); // 查找列表项最近的上层 div 元素 ~~~ ## 查找 find(expr | object | element) 概述：搜索所有与指定表达式匹配的元素。 ~~~ // 从所有的段落开始，进一步搜索下面的 span 元素。与$("p span")相同。 $("p").find("span"); ~~~ ## 相邻之后 next(\[expr\]) 概述：取得一个包含匹配的元素集合中每一个元素紧邻的后面同辈元素的元素集合。 ~~~ $("p").next(); // 找到每个段落的后面紧邻的同辈元素。 // 找到每个段落的后面紧邻的同辈元素中类名为 selected 的元素。 $("p").next(".selected"); ~~~ ## 之后所有 nextAll(\[expr\]) 概述：查找当前元素之后所有的同辈元素。 ~~~ // 给第一个 div 之后的所有元素加个类 $("div:first").nextAll().addClass("after"); ~~~ ## 之后直至 nextUntil(\[expr | element\]\[, filter\]) 概述：查找当前元素之后所有的同辈元素，直到遇到匹配的那个元素为止。 ~~~ // 查找下一个含有 .active 类名的元素，添加红色背景颜色 $('#li-item-1').nextUntil('.active').css('background-color', 'red'); ~~~ ## 定位父级 offsetParent() 概述：返回第一个匹配元素用于定位的父节点。这返回父元素中第一个其 position 设为 relative 或者 absolute 的元素。查找定位过的父级元素。 ~~~ // 设置最近的祖先定位元素的背景颜色 $("p").offsetParent().css("background-color","red"); ~~~ ## 直接父级 parent(\[expr\]) 概述：取得一个包含着所有匹配元素的唯一父元素的元素集合。 ~~~ $("p").parent(); // 查找每个段落的父元素。 $("p").parent(".selected"); // 查找段落的父元素中每个类名为 selected 的父元素。 ~~~ ## 所有父级 parents(\[expr\]) 概述：取得一个包含着所有匹配元素的祖先元素的元素集合（不包含根元素）。 ~~~ $("span").parents(); // 找到每个 span 元素的所有祖先元素。 $("span").parents("p"); // 找到每个 span 的所有是 p 元素的祖先元素。 ~~~ ## 直到父级 parentsUntil(\[expr | element\]\[, filter\]) 概述：查找当前元素的所有的父辈元素，直到遇到匹配的那个元素为止。 ~~~ // 查找 item-a 的祖先，但不包括 level $('li.item-a').parentsUntil('.level').css('background-color', 'red'); ~~~ ## 相邻之前 prev(\[expr\]) 概述：取得一个包含匹配的元素集合中每一个元素紧邻的前一个同辈元素的元素集合。 ~~~ $("p").prev(); // 找到每个段落紧邻的前一个同辈元素。 // 找到每个段落紧邻的前一个同辈元素中类名为 selected 的元素。 $("p").prev(".selected"); ~~~ ## 之前所有 prevAll(\[expr\]) 概述：查找当前元素之前所有的同辈元素。 ~~~ // 给最后一个之前的所有 div 加上一个类 $("div:last").prevAll().addClass("before"); ~~~ ## 之前直到 prevUntil(\[expr | element\]\[, filter\]) 概述：查找当前元素之前所有的同辈元素，直到遇到匹配的那个元素为止。 ~~~ // 查找上一个含有 .active 类名的元素，添加红色背景颜色 $('#li-item-1').prevUntil('.active').css('background-color', 'red'); ~~~ ## 同级兄弟 siblings(\[expr\]) 概述：取得一个包含匹配的元素集合中每一个元素的所有唯一同辈元素的元素集合。 ~~~ $("div").siblings(); // 找到每个 div 的所有同辈元素。 // 找到每个 div 的所有同辈元素中带有类名为 selected 的元素。 $("div").siblings(".selected"); ~~~