.children(selector) 方法是返回匹配元素集合中每個元素的所有子元素（僅兒子輩）。引數可選，新增引數表示通過選擇器進行過濾，對元素進行篩選。

.find(selector)方法是返回匹配元素集合中每個元素的後代。引數是必選的，可以為選擇器、jquery物件可元素來對元素進行篩選。

.find() 與 .children() 方法類似，不同的是後者僅沿著 DOM 樹向下遍歷單一層級。這裡的children，我理解為兒子，只在兒子這一級遍歷。看下例子：

複製程式碼程式碼如下:
.children(selector) 方法是返回匹配元素集合中每個元素的所有子元素（僅兒子輩）。引數可選，新增引數表示通過選擇器進行過濾，對元素進行篩選。

.find(selector)方法是返回匹配元素集合中每個元素的後代。引數是必選的，可以為選擇器、jquery物件可元素來對元素進行篩選。

.find() 與 .children() 方法類似，不同的是後者僅沿著 DOM 樹向下遍歷單一層級。這裡的children，我理解為兒子，只在兒子這一級遍歷。看下例子：    

複製程式碼程式碼如下:
$('ul.level-2').children().css('background-color', 'red'); 

這行程式碼的結果是，專案 A, B, C 得到紅色背景。由於我們沒有應用選擇器表示式，返回的 jQuery 物件包含了所有子元素。如果應用一個選擇器的話，那麼只會包括匹配的專案。

在看個例子：

複製程式碼程式碼如下:
    <script>  
    $(document).ready(function(){  
        $("#abc").children(".selected").css("color", "blue");  
    });  
    </script>  
    <div id="abc">  
        <span>Hello</span>  
        <p class="selected">Hello Again</p>  
        <div><--換成<p>  
            <div class="selected">And Again</div>  
            <span class="selected">aaAnd Again</span>  
        </div><--換成</p>  
        <p>And One Last Time</p>  
    </div>  

得到的結果如下：

這個是預期的結果，但是如果將上面的<div>換成<p>，見上面程式碼註釋，得到的結果卻是：

.find()方法要注意的知識點：

1、find是遍歷當前元素集合中每個元素的後代。只要符合，不管是兒子輩，孫子輩都可以。

2、與其他的樹遍歷方法不同，選擇器表示式對於 .find() 是必需的引數。如果我們需要實現對所有後代元素的取回，可以傳遞通配選擇器 '*'。

3、find只在後代中遍歷，不包括自己。

4、選擇器 context 是由 .find() 方法實現的；因此，$('li.item-ii').find('li') 等價於 $('li', 'li.item-ii')。

選擇器的語法是：jQuery(selector, [context])

一般情況對jquery的選擇器的用法，都是做為第一個引數的用法。其實jquery()函式的這種用法還可以傳遞第二個引數。傳遞這個引數的目的是將前面選擇器限定在context這個環境中。在預設情況下，即不傳第二個引數，選擇器從文件根部對 DOM 進行搜尋（$()將在當前的HTML document中查詢DOM元素）；如果指定了第二個引數，如一個DOM元素集或jquery物件，那就會在這個context中查詢。

下面看個例子

複製程式碼程式碼如下:
$("div.foo").click(function() {  
    $("span", this).addClass("bar");  
}); 

由於我們已經將 span 選擇器限定到 this 這個環境中，只有被點選元素中的 span 會得到附加的class。
在內部，選擇器 context是通過 .find() 方法實現的，因此 $("span", this) 等價於 $(this).find("span")，$('li.item-ii').find('li') 等價於 $('li', 'li.item-ii')