DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> jQuery入門知識 >> JQuery特效代碼 >> Jquery中children與find之間的區別詳細解析
Jquery中children與find之間的區別詳細解析
編輯:JQuery特效代碼     

首先看一段HTML代碼,如下:
. 代碼如下:
<table id="tb">
            <tr>
                <td>0</td>
                <td>1</td>
                <td>2</td>
            </tr>
            <tr>
                <td>3</td>
                <td>4</td>
                <td>5</td>
            </tr>
 </table>

如果我要獲取第二個tr裡的第二個td的值:

Children:
. 代碼如下:
$("#tb>tbody").children("tr:eq(1) td:eq(1)").html()

Find    :
. 代碼如下:
$("#tb>tbody").find("tr:eq(1) td:eq(1)").html()

  結果,通過children獲取的值為:null,而通過find獲取的值為:4 這是為什麼呢?

  查了一下資料,通過children獲取的是該元素的下級元素,而通過find獲取的是該元素的下級所有元素。

  這時回到上面,我們可以得出,$("#tb>tbody").children() 獲取的是兩個tr元素(不包括它們子元素td),

  而children裡面的選擇器則是在獲取的兩個tr元素裡再根據條件進行篩選,所以上面那種寫法獲取不到值。

  如果一定用children我們可以這樣寫:
. 代碼如下:
$("#tb>tbody").children("tr:last").children("td:eq(1)").html()

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved