<p><strong>一、说明</strong></p>    <p>       获取元素的方法分为两种：jQuery选择器、jQuery遍历函数。</p>    <p>      做个总结，巩固下知识。</p>    <p><strong>二、获取本身</strong></p>    <p>      1、只需要一种jQuery选择器</p>    <table align="left" border="2" cellpadding="2" cellspacing="2">     <caption>          </caption>     <tbody>      <tr>       <td><strong>选择器</strong></td>       <td><strong>实例</strong></td>       <td><strong>说明</strong></td>      </tr>      <tr>       <td>#Id</td>       <td>$('#myId')</td>       <td>ID选择器： 可以获取到ID为“myId”的元素，区分大小写</td>      </tr>     </tbody>    </table>    <p>     </p>    <p> </p>    <p> </p>    <p> </p>    <p>       2、多种jQuery选择器组合</p>    <p>            分为两部分：前半部分获取到的是一个元素集合，后半部分可以精确为一个元素，两者相结合，可以获取到想要的元素。</p>    <p>            1）前半部分选择器</p>    <table align="left" border="2">     <caption>          </caption>     <tbody>      <tr>       <td><strong>选择器</strong></td>       <td><strong>实例</strong></td>       <td><strong>说明</strong></td>      </tr>      <tr>       <td>.class</td>       <td>$('.myClass')</td>       <td>类选择器：可以获取到class为‘myClass’的所有元素</td>      </tr>      <tr>       <td>element</td>       <td>$('p')</td>       <td>获取所有的<p>元素</td>      </tr>      <tr>       <td>:header</td>       <td>$(':header')</td>       <td>获取所有的标题元素：<h1> ~ <h6></td>      </tr>      <tr>       <td>:animated</td>       <td>$(':animated')</td>       <td>获取所有的动画元素</td>      </tr>      <tr>       <td>:contains(text)</td>       <td>$('p:contains(Hello)')</td>       <td>获取所有包含文本为Hello的<p>元素，中间的文本区分大小写</td>      </tr>      <tr>       <td>:hidden</td>       <td>$(':hidden')</td>       <td>获取所有的隐藏元素：width和height为0、display:none、type=hidden、</td>      </tr>      <tr>       <td>[attribute]</td>       <td>$('[href]')</td>       <td>属性选择器：获取所有含有属性为href的元素</td>      </tr>      <tr>       <td>[attribute=value]</td>       <td>$('[href=a.html]')</td>       <td> <p>=   获取所有带有属性href，并且值为a.html的元素</p> <p>!=  获取所有带有属性href，并且值不等于为a.html的元素</p> <p>$=  获取所有带有属性href，并且值以a.html结尾的元素</p> <p>^=  获取所有带有属性href，并且值以a.html开头的元素</p> <p>~=  获取所有带有属性href，并且值包含单词”a.html“的元素</p> <p>*=  获取所有带有属性href，并且值包含文本”a.html“的元素</p> </td>      </tr>      <tr>       <td>:input</td>       <td>$(':input')</td>       <td>获取所有input元素</td>      </tr>      <tr>       <td>:radio</td>       <td>$(':radio')</td>       <td> <p>所有带有 type="radio" 的 input 元素</p> <p>相似的有：</p> <p>:text、:chexbox、:password、:submit、:reset、:button、:file</p> </td>      </tr>      <tr>       <td>:enabled</td>       <td>$(':enabled')</td>       <td>所有启用的input元素。 :disabled  则相反</td>      </tr>      <tr>       <td>:checked</td>       <td>$(':checked')</td>       <td>所有选中的input选择（单选框、复选框）</td>      </tr>      <tr>       <td>:gt(index)</td>       <td>$('p:gt(2)')</td>       <td>index从0开始，获取index大于（不包含）2的所有<p>元素</td>      </tr>      <tr>       <td>:lt(index)</td>       <td>$('p:lt(2)')</td>       <td>index从0开始，获取index小于（不包含）2的所有<p>元素</td>      </tr>      <tr>       <td>:even</td>       <td>$('tr:even')</td>       <td>所有偶数<tr>元素</td>      </tr>      <tr>       <td>:odd</td>       <td>$('tr:odd')</td>       <td>所有奇数<tr>元素</td>      </tr>     </tbody>    </table>    <p> </p>    <p>     </p>    <p> </p>    <p> </p>    <p> </p>    <p>           </p>    <p> </p>    <p> </p>    <p> </p>    <p> </p>    <p> </p>    <p> </p>    <p> </p>    <p> </p>    <p> </p>    <p> </p>    <p> </p>    <p> </p>    <p>          </p>    <p> </p>    <p>2）后半部分选择器：可以精确到某一个元素</p>    <table align="left" border="2" cellpadding="1" cellspacing="1">     <tbody>      <tr>       <td><strong>选择器</strong></td>       <td><strong>实例</strong></td>       <td><strong>说明</strong></td>      </tr>      <tr>       <td>:first</td>       <td>$('p:first')</td>       <td>第一个<p>元素</td>      </tr>      <tr>       <td>:last</td>       <td>$('p:last')</td>       <td>最后一个<p>元素</td>      </tr>      <tr>       <td>:eq(index)</td>       <td>$("p:eq(1)")</td>       <td>第二个<p>元素，index从0开始</td>      </tr>     </tbody>    </table>    <p> </p>    <p> </p>    <p> </p>    <p>    3、jQuery选择器+遍历函数</p>    <p>          也是分为两部分：前半部分用选择器获取到一个元素集合，后半部分用遍历函数精确为某个元素</p>    <p>          1）前半部分同上</p>    <p>          2）后半部分：遍历函数</p>    <table align="left" border="2" cellpadding="1" cellspacing="1">     <tbody>      <tr>       <td><strong> 方法</strong></td>       <td><strong> 描述</strong></td>      </tr>      <tr>       <td> eq()</td>       <td> 返回带有被选元素的指定索引号的元素</td>      </tr>      <tr>       <td> first()</td>       <td> 返回被选元素的第一个元素</td>      </tr>      <tr>       <td> last()</td>       <td> 返回被选元素的最后一个元素</td>      </tr>     </tbody>    </table>    <p> </p>    <p> </p>    <p> </p>    <p><strong>三、获取同级元素</strong></p>    <p>      顾名思义：获取<strong>选中元素</strong>的<strong>同级</strong>元素。首先需要定位到该元素（<em>上面已有总结，不再重复</em>），然后获取它的同级元素。</p>    <p>      1）选择器</p>    <table align="left" border="2" cellpadding="1" cellspacing="1">     <tbody>      <tr>       <td><strong>选择器</strong></td>       <td><strong>实例</strong></td>       <td><strong>说明</strong></td>      </tr>      <tr>       <td>element + next</td>       <td>$('div + p')</td>       <td>每个div相邻的下一个<p>元素</td>      </tr>      <tr>       <td>element ~ siblings</td>       <td>$('div ~ p')</td>       <td>获取跟div同级的所有的<p>元素</td>      </tr>     </tbody>    </table>    <p>     </p>    <p> </p>    <p>     2）遍历函数</p>    <table align="left" border="2" cellpadding="1" cellspacing="1">     <tbody>      <tr>       <td><strong>方法</strong></td>       <td><strong>描述</strong></td>      </tr>      <tr>       <td>next()</td>       <td>返回被选元素的后一个同级元素</td>      </tr>      <tr>       <td>nextAll()</td>       <td>返回被选元素之后的所有同级元素</td>      </tr>      <tr>       <td>prev()</td>       <td>返回被选元素的前一个同级元素</td>      </tr>      <tr>       <td>prevAll()</td>       <td>返回被选元素之前的所有同级元素</td>      </tr>     </tbody>    </table>    <p> </p>    <p> </p>    <p> </p>    <p> </p>    <p><strong>四、获取父级元素</strong></p>    <p>      获取<strong>选中元素</strong>的<strong>父级</strong>元素</p>    <p>     1）选择器</p>    <table align="left" border="2" cellpadding="1" cellspacing="1">     <tbody>      <tr>       <td><strong>选择器</strong></td>       <td><strong>实例</strong></td>       <td><strong>说明</strong></td>      </tr>      <tr>       <td>:parent</td>       <td>$('p:parent')</td>       <td>获取所有p元素的父级元素</td>      </tr>     </tbody>    </table>    <p> </p>    <p> </p>    <p>   2）遍历函数</p>    <table align="left" border="2" cellpadding="1" cellspacing="1">     <tbody>      <tr>       <td>方法</td>       <td>描述</td>      </tr>      <tr>       <td>parent()</td>       <td>获取被选元素的父级元素</td>      </tr>      <tr>       <td>parents()</td>       <td>获取被选元素的所有祖先元素</td>      </tr>     </tbody>    </table>    <p> </p>    <p> </p>    <p><strong>五、获取子级元素</strong></p>    <p>      获取<strong>选中元素</strong>的<strong>子级</strong>元素</p>    <p>     1）选择器</p>    <table align="left" border="2" cellpadding="1" cellspacing="1">     <tbody>      <tr>       <td><strong>选择器</strong></td>       <td><strong>实例</strong></td>       <td><strong>说明</strong></td>      </tr>      <tr>       <td>parent > child</td>       <td> $('div > p')</td>       <td> 获取div直接子元素的所有<p>元素</td>      </tr>      <tr>       <td>parent descendant</td>       <td> $('div p')</td>       <td> 获取div所有后代的<p>元素</td>      </tr>     </tbody>    </table>    <p>   </p>    <p> </p>    <p>       2）遍历函数</p>    <table align="left" border="2" cellpadding="1" cellspacing="1">     <tbody>      <tr>       <td><strong>方法</strong></td>       <td><strong>描述</strong></td>      </tr>      <tr>       <td>children()</td>       <td>返回被选元素的所有直接子元素</td>      </tr>      <tr>       <td>contents()</td>       <td>返回被选元素的所有直接子元素(包含文本和注释节点)</td>      </tr>      <tr>       <td>find()</td>       <td>返回被选元素的后代元素</td>      </tr>     </tbody>    </table>    <p> </p>    <p> </p>    <p> </p>    <p> </p>    <p>来自：http://www.cnblogs.com/wenJiaQi/p/6136050.html</p>