1、children()方法
jQuery是一个合集对象，如果想快速查找合集里面的第一级子元素，此时可以用children()方法。这里需要注意：.children(selector) 方法是返回匹配元素集合中每个元素的所有子元素（仅儿子辈，这里可以理解为就是父亲-儿子的关系）
理解节点查找关系：
<div class="div">
<ul class="son">
<li class="grandson">1</li>
</ul>
</div>
代码如果是$("div").children()，那么意味着只能找到ul，因为div与ul是父子关系，li与div是祖辈关系，因此无法找到。
children()无参数
允许我们通过在DOM树中对这些元素的直接子元素进行搜索，并且构造一个新的匹配元素的jQuery对象
注意：jQuery是一个合集对象，所以通过children是匹配合集中每一给元素的第一级子元素
.children()方法选择性地接受同一类型选择器表达式
$("div").children(".selected")
同样的也是因为jQuery是合集对象，可能需要对这个合集对象进行一定的筛选，找出目标元素，所以允许传一个选择器的表达式
具体的操作，请参考下边的代码:
1 <!DOCTYPE html> 2 <html> 3 4 <head> 5 <meta http-equiv="Content-type" content="text/html; charset=utf-8" /> 6 <title></title> 7 <link rel="stylesheet" href="imooc.css" type="text/css"> 8 <style> 9 .left { 10 width: auto; 11 height: 120px; 12 } 13 14 .left div { 15 width: 150px; 16 height: 70px; 17 padding: 5px; 18 margin: 5px; 19 float: left; 20 background: #bbffaa; 21 border: 1px solid #ccc; 22 } 23 24 a { 25 display: block; 26 } 27 </style> 28 <script src="http://lib.sinaapp.com/js/jquery/1.9.1/jquery-1.9.1.min.js"></script> 29 </head> 30 31 <body> 32 <h2>children方法()</h2> 33 <div class="left first-div"> 34 <div class="div"> 35 <ul class="level-1"> 36 <li class="item-1">1</li> 37 <li class="item-2">2</li> 38 <li class="item-3">3</li> 39 </ul> 40 </div> 41 <div class="div"> 42 <ul class="level-2"> 43 <li class="item-1">1</li> 44 <li class="item-2">2</li> 45 <li class="item-3">3</li> 46 </ul> 47 </div> 48 <div class="div"> 49 <ul class="level-3"> 50 <li class="item-1">1</li> 51 <li class="item-2">2</li> 52 <li class="item-3">3</li> 53 </ul> 54 </div> 55 </div> 56 <button id="bt1">点击：children无参数</button> 57 <button id="bt2">点击：children传递表达式</button> 58 <script type="text/javascript"> 59 $("#bt1").click(function() { 60 $('.div').children().css('border', '3px solid red') 61 }) 62 </script> 63 64 <script type="text/javascript"> 65 $("#bt2").click(function() { 66 //找到所有class=div的元素 67 //找到其对应的子元素ul，然后筛选出最后一个，给边宽加上颜色 68 $('.div').children(':last').css('border', '3px solid blue') 69 }) 70 </script> 71 72 </body> 73 74 </html>