这几天遇到的 jQuery 问题

过去一直对 jQuery 一知半解的状态，在这段时间的工作中暴露了。事实证明，实践出真知！现在把遇到的不熟练的记下来。见一个，补充一个！
（试试看 SegmentFault 博客的效果如何）

DOM操作

搜索父元素操作

parents([selector])

用于获取当前匹配元素集合中每个元素的祖先元素，根据需要还可以使用一个选择器进行筛选。

$("p").parents(“li”); //搜索p 的父元素中的 li 元素

这个方法要注意的问题：

1. 从父元素开始匹配查找
2. 一直向上查找直到根元素，然后把这些元素放进一个临时集合中，再用给定的选择器表达式去过滤
3. 可能包含0个、1个或者多个元素

closest(selector[, context])

该方法从元素本身开始，逐级向上级元素匹配，并返回最先匹配的元素。

$("a").closest("div").css("border", "1px solid blue");

这个方法要注意的问题：

1. 从当前元素匹配查找
2. 逐级向上查找，直到发现匹配的元素后就停止了， 其实可以说是找到最近的父元素
3. 返回0或者1个元素

parent([selector])

用于获取当前匹配元素集合中每个元素的父元素，根据需要，还可以使用一个选择器进行筛选。

parentsUtil([selector])

用于获取当前匹配元素集合中每个元素的祖先元素，直至给定选择器匹配的元素(但不包括该元素)

//从 li#li2 开始向上找它的父元素直到 遇到元素 #ul1_li2，但是不将 #ul1_li2 加入包装集 
$("li#li2").parentsUtil("#ul1_li2").css("background", "#FCF");

offsetParent( )方法

格式如下：offsetParent( )，用于搜索第一个匹配元素的已定位的父元素，仅对可见元素有效。
该方法查找第一个匹配元素的已定位元素，并返回由该元素包装成的jQuery对象。

查找兄弟元素

prev([selector])

Get the immediately preceding sibling of each element in the set of matched elements, optionally filtered by a selector.

假设有一个包含一系列 DOM 元素的 jQuery 对象包装集，利用 .prev() 方法搜索每一元素在 DOM 树中的紧邻的兄弟元素并且返回一个包含匹配元素的 jQuery 对象包装集。

这个方法也接受一个选择器来过滤匹配的结果。比如下面的例子，demo请戳这里

<ul>
  <li>list item 1</li>
  <li>list item 2</li>
  <li class="third-item">list item 3</li>
  <li>list item 4</li>
  <li>list item 5</li>
</ul>

$( "li.third-item" ).prev().css( "background-color", "red" );

先找到 class 为 third-item 的li，使用 prev( ) 向前找到它的第一个兄弟元素，修改父元素的背景颜色。

prevAll( )

Get all preceding siblings of each element in the set of matched elements, optionally filtered by a selector.

假设有一个包含一系列 DOM 元素的 jQuery 对象包装集，利用 .prevAll() 方法搜索每一元素在 DOM 树中的所有的前面的兄弟元素并且返回一个包含匹配元素的 jQuery 对象包装集。
这个方法也接受一个选择骑来过滤匹配的集合。

<ul>
  <li>list item 1</li>
  <li>list item 2</li>
  <li class="third-item">list item 3</li>
  <li>list item 4</li>
  <li>list item 5</li>
</ul>

$( "li.third-item" ).prevAll().css( "background-color", "red" );

prevUtil( )

Get all preceding siblings of each element up to but not including the element matched by the selector, DOM node, or jQuery object.

Event对象

to be continued